16 de abr de 2025
Guia completo sobre data layer no Google Tag Manager por Stape
Escrito por
Uliana Lesiv
Atualizado 21 de out de 2025 comentários
O Google Tag Manager (GTM) é uma ótima ferramenta para elevar a análise e o rastreamento de sites. E o data layer é um dos recursos que ajuda a levar o rastreamento para o próximo nível.
Uma camada de dados é um objeto JavaScript que coleta detalhes sobre as interações do usuário em seu site. Com sua ajuda, você pode coletar praticamente qualquer dado, desde visualizações do produto até o sistema operacional do usuário. A utilização de data layers no GTM permite estruturar campanhas de publicidade direcionada com tags e gatilhos mais precisos, fornecendo insights mais ricos sobre o comportamento do usuário.
Por isso, criamos um guia completo sobre a camada de dados que cobrirá muitos aspectos de sua implementação e uso no Google Tag Manager. Explicaremos o que é um data layer, seus casos de uso, implementação do data layer no site, como criar um data layer no Tag Manager, como testar a configuração, além de identificar os erros comuns de configuração.
Vamos começar!
O que é data layer no Tag Manager?
O data layer é um objeto JavaScript usado para passar dados para tags. Ele permite transferir eventos ou variáveis e definir gatilhos com base em valores de variáveis específicas. O data layer é usado no Google Tag Manager na gtag.js.
O data layer é um intermediário entre o seu site e o Google Tag Manager, funcionando como um hub para armazenar dados estruturados para o seu contêiner.
Casos de uso de data layer
Você precisa criar um data layer se você quiser:
- Configurar um rastreamento confiável. Sem um data layer, você extrai dados diretamente do HTML DOM (o padrão usado para adicionar, obter, modificar ou excluir elementos HTML em seu site) e, em seguida, envia os dados diretamente para o contêiner GTM. O problema é que o HTML DOM pode mudar, levando à interrupção do disparo de tags e da coleta de dados.
Você não encontrará esse problema com data layer, pois o contêiner GTM extrai dados do data layer da página, que é muito mais estável que o HTML DOM. Os dados param de serem gravados somente se alguém quebrar o data layer da página.
- Enriquecer os dados das tags em condições específicas. Digamos que você queira enviar dados sobre o valor do evento de compra apenas se o usuário pagou mais de US$ 50. Em vez de pesquisar variáveis dispersas, detalhes de transações, categorias de páginas e outros sinais em sua página, usar uma um data layer preenchido com variáveis relevantes e seus valores (em nosso caso, valor de compra > US$ 50) ajuda a garantir que os dados necessários estejam prontamente acessíveis sempre que suas tags precisarem.
Como o data layer funciona?
Você pode especificar exatamente quais dados deseja armazenar nesta camada. Existem dois métodos para criar o data layer e preenchê-la com os parâmetros necessários para rastrear, que revisaremos na próxima seção.
O GTM lê e pega os valores necessários do data layer dados e os envia para ferramentas analíticas como Google Analytics, Google Ads, Facebook Pixel, etc.
Sintaxe e exemplos do data layer
No Google Tag Manager, o dataLayer é um array, conforme indicado por "[]", e contém um objeto, representado por "{}" conforme mostrado no script abaixo:
dataLayer = [{}];Os elementos dentro de um data layer são chamados de variáveis e são formatados como pares ‘key’: ‘value’ (colocados em "{}").
GTM usa uma variável de data layer chamada “evento”, que também é usada por ouvintes de eventos JavaScript para acionar tags quando um usuário interage com elementos em um site. Portanto, com base no exemplo abaixo, o ‘evento’ é ‘key’ e ‘register’ é ‘value’.
dataLayer = [{'event' : 'register' }];Para variáveis, a sintaxe é a mesma dos eventos. No exemplo abaixo, pegamos o país desejado para rastreamento - 'país' ('variable_name') é 'key' e 'estados unidos' é 'value' (‘variable_value’).
dataLayer = [{'country' : 'united states' }];Inicialize o dataLayer
Existem dois métodos para implementação de um data layer: declaração e push de um data layer. Descreveremos como usar os dois métodos, mas você pode pular diretamente para aquele que melhor lhe convier.
Resumindo, recomendamos o uso de dataLayer.push porque é mais popular e cobre a maioria das necessidades. Além disso, esse método é mais seguro de usar, pois não interrompe eventos no Google Tag Manager, enquanto a configuração inadequada de declarações do data layer pode facilmente causar problemas.
| Declaração de Data Layer | dataLayer.push | |
| Funciona melhor para | Valores necessários antes do carregamento da página | Enviar informações para o dataLayer para eventos diferentes do evento de carregamento de página |
| Tempo de push da variável do data layer | Antes do tempo de execução | Durante o tempo de execução |
| Inserção no código | Acima do snippet de contêiner do Google Tag Manager | Qualquer lugar no código |
| Declaração de salto para o data layer | Vá para dalaLayer.push |
Método 1: Declaração do data layer
Para usar esse método, o snippet do data layer deve ser colocado acima do snippet de contêiner do Google Tag Manager. Nesse caso, o data layer é inicializado antes do Tag Manager ser inicializado.
No geral, esta não é uma forma popular ou recomendada de criar um data layer, mas funcionará se você quiser criar pontos de dados antes do carregamento do contêiner GTM e usar esses pontos de dados para gerenciamento de tags.
Alterou 'variable_name': 'variable_value' para os parâmetros necessários e colou o código na página do site antes do snippet GTM.
dataLayer = [{
'variable_name': 'variable_value'
}];
...
Observação: Use o operador "=" para atribuir os valores do objeto ao array dataLayer.
Método 2: dataLayer.push
O método push adiciona elementos de objeto ao data layer. Ao contrário do método de declaração de data layer, com dados push, você pode colocar o snippet do data layer em qualquer lugar do código.
Pode ser um pouco confuso, mas 'dataLayer' também é uma variável JavaScript que pode ser acessada por qualquer função interagindo com o objeto window. Portanto, para evitar conflitos com qualquer outro array JavaScript local denominado 'dataLayer', a melhor maneira é usar o prefixo 'window.dataLayer'.
Portanto, você precisará usar o código abaixo para o método dataLayer.push. Em vez de 'variable_name': 'variable_value', adicione os parâmetros necessários.
window.datalayer = window.dataLayer || [];
window.dataLayer.push({
'variable_name' : 'variable_value'
});No bloco de código acima, o dataLayer é definido como um dataLayer existente, se já existir; caso contrário, um novo dataLayer será criado como um array vazio. O operador || (OU) garante que a atribuição acontecerá se qualquer uma dessas condições for atendida.
Dessa forma, você evitará a criação de múltiplas declarações, que podem sobrescrever dataLayer.
Exemplo e documentação sobre a camada de dados do comércio eletrónico
Para muitos CMS de comércio eletrónico existem plugins (incluindo plugins da Stape) que podem criar uma camada de dados para eventos de comércio eletrónico padrão. Nalguns casos, isto pode não ser suficiente. Por exemplo, se precisar de eventos adicionais ou de dados adicionais nos eventos da camada de dados. Ou se estiver a utilizar uma plataforma totalmente personalizada.
Neste caso, é necessário contactar os seus programadores para criar eventos da camada de dados com o payload de que necessita. Esta é normalmente uma tarefa bastante simples para os programadores e não demora muito tempo, embora dependa da arquitetura do seu site ou plataforma.
Algumas diretrizes úteis:
- Faça uma cópia do documento, remova os eventos de que não precisa e/ou adicione os eventos de que precisa e um exemplo de carga útil.
- Utilize o mesmo formato de dados em todos os eventos. É preferível seguir o formato GA4.
- Se não for um evento óbvio (por exemplo, ver item ou adicionar ao carrinho), descreva em pormenor quando deve ser acionado. Isto evitará idas e vindas desnecessárias entre si e os programadores.
- Os dados do utilizador podem ser utilizados em praticamente todas as plataformas de marketing. É importante que estejam disponíveis na camada de dados - a sua utilização melhorará consideravelmente os resultados do rastreio.
- Tente evitar eventos da camada de dados que sejam enviados antes de o utilizador ser redireccionado para outra página. Isto pode levar à perda destes dados, uma vez que os eventos podem não ser efetivamente enviados antes do redireccionamento. Por exemplo, se pretender enviar um evento Lead depois de um utilizador submeter um formulário e, em seguida, o utilizador for enviado para a página de agradecimento, a melhor prática é enviar este evento na camada de dados na página de agradecimento, em vez de quando o utilizador submete efetivamente o formulário.
- Se já tiver alguns eventos da camada de dados no seu site, é melhor utilizar alguns nomes personalizados para os novos eventos da camada de dados e não modificar os eventos antigos para não afetar o rastreio existente no processo. Ou seja, se já tiver, por exemplo, add_to_cart na camada de dados, é melhor criar um novo evento add_to_cart_v2 em vez de alterar o antigo e depois reconfigurar as etiquetas para os novos eventos.
- Certifique-se de que verifica a camada de dados depois de os programadores terem implementado isto. Por vezes, mesmo pequenos erros na carga útil podem causar problemas de rastreio.
Como criar um data layer no Tag Manager?
Você pode acessar os elementos de sua matriz de data layer no Google Tag Manager de maneira diferente. Para aproveitar os dados do Google Tag Manager, atribua-os a uma variável ou use-os como um acionador de eventos. Essas variáveis ou eventos podem então ser incorporados em suas tags, gatilhos ou outras variáveis.
Abaixo, fornecemos três casos de uso de data layer e sua configuração no GTM:
Caso de uso 1: Variáveis da camada de dados como pontos de dados
Exemplo de código
Como exemplo, tomamos o valor de compra de camisetas laranja.
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
‘product_name’ : ‘orange t-shirt’,
'purchase_value' : '5',
‘purchase_currency’ : ‘EUR’
});Configuração do GTM
- 1.Para configuração de variáveis, no container GTM, vá em Variáveis → clique em “New” em User-Defined Variables.
2. Escolha "Data Layer Variable" como o tipo de variável.
3. Adicione o nome da variável do data layer e clique em “Save”.
Por favor, observe: o campo diferencia maiúsculas de minúsculas, portanto, certifique-se de que o nome corresponda ao nome do valor no código que você adicionou à página. No nosso caso, é “purchase_value”.
Caso de uso 2: data layer para acionar eventos
Exemplo de código
Como exemplo de código, tomamos a variável dataLayer que aciona o evento “register” quando uma pessoa preenche os dados necessários para o registro e clica em “register”.
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event' : 'register'
});Configuração GTM
1. Vá para os acionadores do Google Tag Manager → clique em "New".
2. Escolha o tipo de gatilho "Custom Event".
3. Em “Event name”, adicione o nome da mesma forma que o nome do valor no código, pois este campo diferencia maiúsculas de minúsculas. Clique em "Save".
Caso de uso 3: Variável de data layer como variáveis e gatilhos de eventos
Exemplo de código
O exemplo da variável de data layer abaixo aciona eventos de compra e cria informações de compra.
dataLayer = [{
'event': 'purchase',
'purchase_info': {
'purchase_amount': 5,
'purchase_curency': 'EUR'
}
}];Configuração do GTM
Você pode usar variáveis do código como variáveis e acionadores de eventos no Google Tag Manager. Verifique o processo de configuração das etapas anteriores para variáveis e eventos.
O data layer existe no GTM do lado do servidor?
O data layer não existe no Google Tag Manager do lado do servidor, como acontece no GTM do lado do cliente.
Entretanto, o sGTM possui um objeto chamado Cliente que verifica as solicitações HTTP do web GTM. Se a solicitação contiver dados específicos, o Cliente transforma os dados da solicitação em dados do evento. As tags também são usadas para enviar os dados do contêiner web GTM para o servidor GTM.
Para preencher os pontos de dados do contêiner do servidor GTM, você precisa escolher o método que usará para enviar dados da web para o servidor GTM; entre os populares estão:
Usando o Google Analytics 4
Esse método é particularmente eficaz se você estiver configurando o rastreamento do lado do servidor para Google Ads ou Floodlight, já que ambos dependem exclusivamente de tags GA4.
1. No web GTM crie uma tag com configuração "Google Analytics: GA4 Event".
2. Você encontrará campos predefinidos para esses dados e poderá atribuir variáveis do data layer a cada parâmetro individualmente.
Usando Data Tag/Data Client
A principal vantagem de usar Data Tag/Data Client é que ele envia automaticamente o data layer e outros dados comuns da web para o servidor GTM.
1. Crie uma nova tag no contêiner GTM web e escolha "Data Tag" como configuração da tag.
Por favor, observe: Você precisa adicionar a Data Tag à galeria GTM
2. Na configuração das tags, habilite as duas caixas de seleção “Send common data” e “Enviar todos do DataLayer”.
O sistema analisará automaticamente os dados no GTM web e encaminhará todas as informações disponíveis para o servidor GTM.
| Confira nosso post no blog sobre como criar um data layer para o Google Tag Manager do lado do servidor para saber mais sobre o processo de configuração. |
Enviar variável do data layer para o Google Analytics 4
Observe: Abaixo, descrevemos como configurar a tag do Google Tag para enviar dados; se você já configurou a tag do Google, não há necessidade de criar uma nova tag. Basta pular as etapas abaixo e ir diretamente para a seção sobre como criar uma dimensão personalizada.
Neste caso, você só precisa adicionar parâmetros como no código do data layer na seção "Shared event settings".
Configure a Google tag no GTM
1. Na seção “Tags” do GTM, clique em “New” e escolha “Google Tag” como tipo de tag.
2. Adicione seu ID de medição do GA4 e, na seção "Shared Event Settings", liste os parâmetros que você adicionou ao seu código.
3. Como gatilho escolha "Page View – All Pages".
Crie uma dimensão personalizada no GA4
Existe uma lista de parâmetros padrão. Se os dados que você deseja rastrear com a ajuda do data layer não estiverem presentes nos eventos recomendados do Google Analytics, você precisará adicioná-los manualmente em sua conta GA4 como dimensões personalizadas. Depois de adicioná-lo, ele aparecerá nos relatórios do GA4.
1. Na conta do Google Analytics, clique em “Admin” → “Custom definitions”.
2. Clique em "Criar uma dimensão personalizada" e preencha o parâmetro obrigatório.
- Nome da Dimensão - o nome que você deseja ver nos relatórios.
- Escopo - escolha um escopo de evento, usuário ou item.
- Parâmetro de evento – adicione o nome da variável ou do evento como as especificado no snippet do data layer (observe que os dados no campo diferenciam maiúscula de minúscula).
Clique em "Save".
Testar configuração de data layer
Modo de Debug do GTM
Para verificar se o Google Tag Manager captura a variável, você precisa seguir algumas etapas simples, semelhantes à depuração regular no GTM.
1. Clique em "Preview" e adicione o URL do site que você está depurando.
2. Mude para a aba "Variable" e se tudo funcionar, você verá os dados necessários nesta aba.
Se você tiver problemas com o Modo de Depuração no GTM, verifique nossos guias:
Google Analytics 4
Para verificar se o Google Analytics captura os dados, vá em “Admin” → DebugView.
Solução de problemas do data layer
1° Problema: O envio do data layer não funciona
Se você perceber que variáveis ou eventos falham no push, provavelmente você não está usando letras maiúsculas e minúsculas adequadas para nomes de objetos ou aspas perdidas.
Solução: letras maiúsculas e minúsculas adequadas para nomes de objetos e aspas
- Verifique se "dataLayer" está em camel case.
Bom exemplo:
dataLayer.push({'variable_name': 'variable_value'});Mau exemplo:
datalayer.push({'variable_name': 'variable_value'});- Certifique-se de que todos os nomes de variáveis estejam entre aspas.
Bom exemplo:
dataLayer.push({'variable_name': 'variable_value'});Mau exemplo:
dataLayer.push({variable_name': 'variable_value'});2° Problema: Tags não disparam
Se você não conseguir disparar tags em todos os locais necessários no site, verifique os nomes das variáveis em diferentes páginas.
Solução: nomes de variáveis consistentes
O erro mais frequente é a inconsistência de letras maiúsculas e minúsculas nos nomes das variáveis em páginas diferentes, portanto, é necessário revisar os nomes.
Bom exemplo:
// Homepage:
dataLayer.push({'variable_name': 'variable_value'});
// Product page:
dataLayer.push({'variable_name': 'variable_value'});Mau exemplo:
// Homepage:
dataLayer.push({'variable_name': 'variable_value'});
// Product page:
dataLayer.push({'variable Name': 'variable_value'});Recapitulando
O data layer do Google Tag Manager (GTM) é um componente crucial do GTM. Ele nos permite capturar as interações dos usuários com o seu site, ao mesmo tempo que fornece dados adicionais sobre a interação ou seu contexto. O data layer é essencial se você deseja criar uma estrutura de dados melhor.
O conceito de data layer é bastante desafiador de implementar e provavelmente serão necessários desenvolvedores para construir uma infraestrutura de rastreamento complexa.
Aqui está uma rápida recapitulação:
- Recomendamos usar o método dataLayer.push para implementar o data layer
- Após a implementação do data layer, você poderá usá-la como pontos de dados, acionadores de eventos, ou ambos
- Se você estiver usando o rastreamento do lado do servidor, combine o acompanhamento do lado do cliente e do lado do servidor para implementar o data layer
- Adicione dimensões personalizadas no GA 4 (se você usar esta ferramenta) para ver os dados nos relatórios GA4
- Lembre-se dos erros frequentes que causam mau funcionamento do data layer: use letras maiúsculas e minúsculas adequadas e siga nomes de variáveis consistentes em todo o código adicionado, bem como ao configurar o rastreamento no GTM.
Quer começar no lado do servidor?
Experimente gratuitamente
Comentários