No GTM, você precisa capturar os dados dinâmicos da página (como nome, descrição, preço, etc.).

Para isso, comece criando variáveis personalizadas para seu schema:

  • Nome do Produto: Use o seletor CSS ou JavaScript para capturar o nome do produto.
  • Descrição do Produto: Capture a descrição do produto.
  • Preço: Capture o preço do produto.
  • SKU: Capture o SKU do produto.
  • Marca: Capture a marca do produto.
  • Disponibilidade: Capture a disponibilidade (ex.: “Em estoque”).

Exemplo de como capturar o nome do produto com JavaScript:

function() {
  return document.querySelector('.product-title').innerText;
}

Repita esse processo para cada atributo que você deseja incluir no schema.

2. Crie uma Tag Custom HTML

Agora, crie uma tag no GTM para gerar o schema JSON-LD dinamicamente:

  1. No GTM, vá para Tags > New.
  2. Nomeie a tag (ex.: “Schema Markup – Product”).
  3. Escolha o tipo de tag: Custom HTML.
  4. Cole o seguinte código na área de HTML:

Esse é um schema JSON que quero deixar dinâmico com as variáveis que adicionei ok? Coloque o que você deseja no seu Google Tag Manager.

<script type="application/ld+json">
{
  "@context": "https://schema.org/",
  "@type": "Product",
  "name": "{{Nome do Produto}}",
  "description": "{{Descrição do Produto}}",
  "brand": {
    "@type": "Brand",
    "name": "{{Marca do Produto}}"
  },
  "sku": "{{SKU do Produto}}",
  "offers": {
    "@type": "Offer",
    "price": "{{Preço do Produto}}",
    "priceCurrency": "BRL",
    "availability": "{{Disponibilidade do Produto}}"
  }
}
</script>

Substitua os placeholders ({{Nome do Produto}}, {{Descrição do Produto}}, etc.) pelas variáveis que você criou no Passo 1.

3. Configure o Trigger

Agora, defina quando essa tag deve ser acionada:

  1. Clique em Triggering.
  2. Escolha All Pages (se o schema for aplicado em todas as páginas) ou crie um trigger personalizado para acionar apenas nas páginas de produto.
    • Para páginas de produto, use uma regra como: Page URL contém /produto/ (ajuste conforme a estrutura do seu site).

4. Teste e Publique

  1. Use o Preview Mode do GTM para testar a implementação.
    • Acesse uma página de produto e verifique se o schema JSON-LD está sendo injetado corretamente.
    • Use a ferramenta Rich Results Test do Google para validar o schema.
  2. Se tudo estiver funcionando, publique a tag no GTM.

Exemplo Completo de Tag Custom HTML

Aqui está um exemplo completo de como a tag pode ficar no GTM:

<script type="application/ld+json">
{
  "@context": "https://schema.org/",
  "@type": "Product",
  "name": "{{Nome do Produto}}",
  "description": "{{Descrição do Produto}}",
  "brand": {
    "@type": "Brand",
    "name": "{{Marca do Produto}}"
  },
  "sku": "{{SKU do Produto}}",
  "offers": {
    "@type": "Offer",
    "price": "{{Preço do Produto}}",
    "priceCurrency": "BRL",
    "availability": "{{Disponibilidade do Produto}}"
  }
}
</script>

Dicas Adicionais

  1. Validação: Sempre valide o schema usando o Rich Results Test do Google.
  2. Atualizações: Se você adicionar novos atributos ao schema, atualize as variáveis e a tag no GTM.
  3. Desempenho: Certifique-se de que o script não afeta o desempenho do site. O GTM já é otimizado para isso, mas evite scripts desnecessários.

Automatização para Múltiplos Produtos

Se o seu e-commerce tem milhares de produtos, essa abordagem é escalável, pois o GTM injeta o schema dinamicamente em todas as páginas de produtos sem a necessidade de modificações manuais no código-fonte.

Categorized in:

Schemas,