Como adicionar o Google Tag Manager ao seu site (configuração) | We.Inc
Instale o Google Tag Manager do jeito que o Google documenta: snippets no head e no body, uma Google tag do GA4, o modo de visualização e o rastreamento em apps de página única. Gerador de snippets para o seu ID do GTM.
Crie um contêiner no Tag Manager para receber um ID como GTM-ABCD123. Cole o primeiro snippet do Google o mais alto possível no <head> e o segundo, um iframe noscript, logo depois da tag de abertura <body>, em todas as páginas. Depois adicione as tags, como a do Google Analytics, dentro do Tag Manager e publique.
Configuração num relance
Etapa
Onde
O que fazer
1. Criar um contêiner
Escolha Web como plataforma e anote o ID GTM-
2. Instalar os snippets
O HTML do seu site ou as configurações do tema
Snippet do head no alto do <head>, snippet noscript logo depois do <body>
3. Adicionar uma tag
Espaço de trabalho do Tag Manager
Para o Analytics: tipo de tag Google Tag com o seu ID G-
4. Testar
Botão Visualizar
O Tag Assistant se conecta ao seu site e mostra quais tags foram disparadas
5. Publicar
Enviar no espaço de trabalho
Nada entra no ar no seu site até você publicar
O Google Tag Manager é um contêiner gratuito para códigos de rastreamento. Em vez de colar o script de cada ferramenta no seu site, você instala um contêiner uma vez e depois adiciona, altera ou remove tags (pequenos scripts de analytics, anúncios e ferramentas parecidas) pelo site do Tag Manager. Digite o ID do seu contêiner no gerador para receber os dois snippets prontos para colar.
Informe o ID do seu contêiner. O gerador confere se ele tem o formato GTM- seguido de letras e números.
Copie o snippet do head para o <head> de todas as páginas, o mais alto que puder.
Copie o snippet do body para a linha logo depois da tag de abertura <body>.
Abra o Tag Manager, clique em Visualizar, informe o endereço do seu site e confirme que o Tag Assistant mostra Conectado.
Instale um contêiner por site. O guia de camada de dados do Google avisa que mais de uma camada de dados por página faz as tags dispararem errado.
Se uma página define dados para as tags, coloque window.dataLayer = window.dataLayer || []; e as suas chamadas push acima do snippet do contêiner.
Remova qualquer código do Analytics que você colou diretamente antes de adicionar a mesma tag no Tag Manager, ou cada visita será contada duas vezes.
Muitos construtores de sites têm um campo para o ID do GTM. Se o seu tiver, use esse campo e não cole nada à mão.
Perguntas frequentes
Onde exatamente vai o código do Google Tag Manager?
A ajuda de instalação do Google diz para colar o primeiro bloco o mais alto possível na tag <head> e o segundo bloco logo depois da tag de abertura <body>, em todas as páginas do site.
Ainda preciso da parte noscript?
O Google a inclui no código de instalação. É um iframe dentro de um elemento noscript, que os navegadores só usam quando o JavaScript está desativado. Cole exatamente como o Google entrega.
Como adiciono o Google Analytics 4 pelo Tag Manager?
No Tag Manager, adicione uma nova tag, escolha Google Tag como tipo e informe o seu ID de tag que começa com G-. Escolha um acionador de inicialização, salve, teste no modo Visualizar e depois publique.
Por que o Tag Manager não rastreia as mudanças de página no meu app de página única?
Apps que trocam de página sem recarregar não disparam um novo carregamento de página. Use o acionador Alteração no histórico, que segundo o Google dispara quando o fragmento do URL muda ou quando o site usa a API pushState do HTML5.
O Google Tag Manager é grátis?
A versão padrão é de uso gratuito. O Google também vende o Tag Manager 360 como parte dos produtos empresariais.
Como testar com o modo Visualizar
No seu espaço de trabalho, clique em Visualizar no canto superior direito. O Tag Assistant abre numa nova aba: informe o endereço do seu site e clique em Conectar. O site abre numa nova janela e mostra Conectado no canto.
De volta à aba do Tag Assistant, clique em Continuar para ver cada evento e quais tags foram disparadas. Corrija o que não disparou antes de publicar.
Como enviar os seus próprios eventos
A camada de dados é um array JavaScript que passa informações ao Tag Manager. Faça push de um objeto com uma chave event, como uma inscrição na newsletter, e crie um acionador de Evento personalizado com o mesmo nome.
O guia do Google diz que a camada de dados diferencia maiúsculas de minúsculas, então dataLayer funciona e datalayer não, e que você deve sempre só fazer push nela, nunca reatribuí-la.
Fazer push de um evento na camada de dados
Use isto quando acontece algo que o Tag Manager não consegue ver sozinho, como um formulário que envia sem sair da página.
Evento de inscrição na newsletter
Crie no Tag Manager um acionador de Evento personalizado chamado newsletter_signup para disparar tags com ele.
Acionadores que você vai usar primeiro
Acionadores comuns do Tag Manager
Acionador
Dispara quando
Uso típico
Inicialização
Antes de todos os outros acionadores, exceto Inicialização do consentimento
Google Tag do Analytics
Visualização de página
Quando o navegador começa a carregar uma página
A maioria das outras tags de página
Alteração no histórico
O fragmento do URL muda ou a página chama pushState
Visualizações de página em apps de página única
Evento personalizado
O seu código faz push de um evento correspondente na camada de dados
Envios de formulário, inscrições, reservas
Clique
Um visitante clica num elemento ou link
Cliques em links de telefone e e-mail
Gerador de snippets
Digite o ID do contêiner que aparece no topo do seu espaço de trabalho do Tag Manager. Tudo é gerado no seu navegador.
ID do contêiner
Parece certo. Cole os dois snippets em todas as páginas.
Isso não parece um ID de contêiner. Ele deve começar com GTM- seguido de letras e números.