No vídeo de hoje, vou te ensinar como coletar dados do Data Layer do seu site utilizando o Google Tag Manager (GTM), criando variáveis para armazenar essas informações e enviá-las junto com seus eventos. Se o traqueamento de e-commerce te assusta por parecer muito técnico, cheio de parâmetros e complexidade, este tutorial vai simplificar o processo para você.
Assista ao vídeo abaixo para ver o passo a passo detalhado:
O Que é o Data Layer e Por Que Ele é Importante?
O Data Layer é uma estrutura usada para armazenar informações sobre eventos e interações que ocorrem no seu site, como visualizações de produtos, transações, ou cliques. Essas informações ficam organizadas em um formato que o Google Tag Manager pode interpretar e utilizar para coletar dados e enviar para outras plataformas, como o Google Analytics.
O Data Layer segue uma estrutura hierárquica de chaves e valores, onde as informações estão organizadas de maneira aninhada. Cada “chave” representa uma categoria de dados, e cada “valor” é a informação associada a essa chave. Vamos ver um exemplo de Data Layer para entender como essa coleta funciona.
Estrutura do Data Layer
Aqui está um exemplo de Data Layer para uma página de produto:
{
gtmparams: {
pagetype: "product",
product: {
id: "2708818",
name: "Porta Lápis em tecido (17 x 10 cm) - Batik Mendes ? com diversas estampas em dupla face"
}
},
event: "view_item",
gtm: {uniqueEventId: 801, start: 1723294770162},
ecommerce: {
currency: "BRL",
value: 40,
items: [
{
item_id: "2708818.162771.322920",
item_name: "Porta Lápis em tecido (17 x 10 cm) - Batik Mendes ? com diversas estampas em dupla face",
item_variant: "BAIANA-IGREJA-PH208",
currency: "BRL",
quantity: 1,
price: 40,
item_category: "Bolsas",
item_category2: "",
item_category3: ""
}
]
}
}
Este Data Layer contém diversas informações úteis sobre o produto visualizado, como ID do produto, nome, categoria, preço, e outras características do evento e da transação. Vamos explorar como coletar essas informações utilizando o GTM.
Coletando Dados do Data Layer no Google Tag Manager
Agora, vamos ao passo a passo de como configurar as variáveis para coletar essas informações no GTM.
1. Como Funciona a Hierarquia no Data Layer
O primeiro conceito a entender é que o Data Layer segue uma estrutura de chaves e valores alinhados. Cada nível dessa hierarquia é separado por pontos no GTM. Sempre que você vê uma chave { (chave), ela contém um conjunto de dados dentro. O mesmo vale para [ (colchetes), que indicam um array ou uma lista de múltiplos itens.
Por exemplo, se você quiser acessar o id do produto, a estrutura hierárquica seria:
gtmparams.product.id.
2. Coletando o ID do Produto
Se você quiser coletar o ID do produto (que neste exemplo é “2708818”), a estrutura seria:
• Chave Principal: gtmparams
• Subchave: product
• Chave de Dados: id
Portanto, o caminho no GTM será: gtmparams.product.id.
3. Coletando o Nome do Produto
Agora, se você quiser coletar o nome do produto, o processo é semelhante. Você acessaria o caminho:
gtmparams.product.name.
Aqui, gtmparams é a chave principal, product é a subchave e name é a chave final que contém o valor que você deseja capturar.
4. Coletando o Preço do Produto
Para acessar o preço do produto, você vai precisar navegar até o objeto ecommerce. O caminho será:
• Chave Principal: ecommerce
• Subchave: items
• Indexação do Item (primeiro item): [0]
• Chave de Dados: price
Portanto, o caminho será: ecommerce.items[0].price.
5. Coletando a Categoria do Produto
Caso queira capturar a categoria do produto, você pode seguir o mesmo padrão, já que a categoria está dentro do primeiro item do array items no Data Layer:
• Chave Principal: ecommerce
• Subchave: items
• Indexação do Item: [0]
• Chave de Dados: item_category
O caminho completo será: ecommerce.items[0].item_category.
Exemplo Prático no Google Tag Manager
Agora que você entendeu a lógica, vamos colocar isso em prática dentro do GTM.
Passo 1: Acesse o Google Tag Manager
• Vá para a seção de variáveis e clique em Nova Variável.
• Selecione Variável da Camada de Dados (Data Layer Variable).
Passo 2: Configurando a Variável
Para coletar o id do produto:
• Nome da Variável: gtmparams.product.id
• Nome interno: ID do Produto
Clique em Salvar.
Passo 3: Testando no Modo de Visualização
Após configurar a variável, acesse o modo de visualização do GTM para garantir que os valores estão sendo capturados corretamente. Você verá o ID do produto e outras variáveis sendo preenchidas automaticamente ao visualizar a página do produto.
Conclusão
Ao entender como a estrutura de um Data Layer funciona e como criar variáveis no Google Tag Manager para capturar essas informações, você domina uma das partes mais complexas do traqueamento de e-commerce. O poder do Data Layer está na capacidade de coletar dados detalhados sobre os produtos e o comportamento dos usuários no site, proporcionando informações valiosas para otimizar campanhas e melhorar a performance de suas estratégias de marketing.
Se você deseja aprender a implementar traqueamento avançado, clique aqui para conhecer meu método Marketeiro Data Driven.
