Como instalar o Gerenciador de tags do Google em seu site
Publicados: 2022-04-12O Google Tag Manager (GTM) é um serviço gratuito que simplifica muito o trabalho com tags em sites e aplicativos móveis. Com o GTM, você pode alterar facilmente o código nas páginas, adicionar novos fragmentos e integrar seu site a sistemas analíticos, publicidade e outros serviços.
Para começar, você precisará instalar o código do Gerenciador de tags em seu site. Depois disso, todas as outras configurações podem ser ajustadas na interface de serviço sem envolver os programadores. Você pode saber mais sobre o Google Tag Manager e como ele funciona em conjunto com o Google Analytics em nosso artigo. Se você já está familiarizado com isso, não perca tempo e prossiga com a instalação do GTM.
Em resumo, para instalar o Gerenciador de tags do Google, você precisará:
- crie uma conta e um contêiner no Google Tag Manager;
- instalar o código do Google Tag Manager em seu site;
- publicar o contêiner;
- verifique o Gerenciador de tags do Google.
1. Crie uma conta e um contêiner no Gerenciador de tags do Google
Na página inicial do Gerenciador de tags, clique no botão Registrar e faça login usando seu endereço do Gmail ou qualquer outra conta do Google:
Agora você precisa criar uma conta diretamente no Gerenciador de tags. Para fazer isso, clique em Fazer login no Gerenciador de tags :
Em seguida, clique em Criar conta :
Pense em um nome para sua conta — é mais conveniente usar o nome da sua empresa. Em seguida, selecione o país, marque a caixa ao lado de Compartilhar dados anonimamente com o Google e outros serviços (opcional) e clique em Continuar :
Agora você precisa configurar o container. Se você comparar a estrutura do Google Tag Manager com a estrutura do Google Analytics, o contêiner é o equivalente a um recurso no GA. Ele armazena tags, gatilhos e variáveis para todo o site. Pode haver vários contêineres em uma conta do GTM: para o site, para o aplicativo móvel, para páginas AMP e assim por diante. Para torná-lo conveniente, é melhor nomear o contêiner com o nome do recurso para o qual ele foi criado. Por exemplo, este pode ser o endereço do seu site.
Depois de inserir o nome do contêiner, selecione onde ele será usado (no nosso exemplo, este é Web ) e clique em Criar :
Leia as regras para usar o Gerenciador de tags. Marque a caixa na parte inferior da página confirmando que você concorda com as condições de processamento de dados de acordo com o GDPR e clique em Sim :
Depois disso, você verá uma janela com o fragmento de código GTM que precisa ser instalado em seu site:
Você pode copiar imediatamente o código e instalá-lo em todas as páginas do site que deseja monitorar ou clicar em Ok e fazer isso mais tarde quando adicionar as primeiras tags ao contêiner. Você pode visualizar e copiar o código a qualquer momento em Administração → Instalar o Gerenciador de tags do Google :
2. Instale o código do Gerenciador de tags do Google em seu site
Se você estiver familiarizado com o desenvolvimento de sites e tiver acesso ao painel de administração, é fácil adicionar o código do Gerenciador de tags. Aqui está um exemplo de como fazer isso através do WordPress. Caso contrário, você ainda terá que pedir ajuda aos programadores; caso contrário, existe o risco de quebrar o código-fonte da página.
O código do Gerenciador de tags do Google consiste em dois fragmentos e é carregado de forma assíncrona. Ou seja, a parte principal da página continua sendo carregada sem esperar o carregamento do contêiner GTM. A primeira parte do código deve ser colocada no cabeçalho da página, o mais próximo possível da tag de abertura <head>:
Isso ocorre porque quanto maior a posição do primeiro fragmento, mais rápido ele será carregado. Se você inseri-lo na tag <body>, corre o risco de perder dados sobre usuários que saem da página antes de carregar essa tag.
A segunda parte do código funciona como backup e ajuda a rastrear as ações dos usuários que desabilitaram o JavaScript. Deve ser colocado imediatamente após a tag de abertura <body>:
Importante!
O código GTM deve ser colocado diretamente na página que você vai acompanhar, ou seja, em todo o seu site. Colocar o código em um iframe oculto ou implantá-lo em outro sistema de gerenciamento de tags não permitirá o rastreamento correto de tags na página principal.
Como instalar o Gerenciador de tags do Google em uma página AMP
Se você usa a tecnologia AMP para carregar e adaptar páginas rapidamente para dispositivos móveis, a primeira parte do código deve ser colocada antes da tag de fechamento </head>:
E a segunda parte do código deve ser inserida imediatamente após a tag de abertura <body>:
3. Publique o contêiner
Mesmo que você não tenha adicionado uma única tag ao contêiner, recomendamos publicá-la imediatamente após instalar o código GTM em seu site. Caso contrário, o contêiner causará um erro 404. Isso não é crítico, no entanto. Se você estiver rastreando erros de JavaScript usando determinados serviços, como o TrackJS, os erros 404 encherão seus relatórios. Para não causar estresse desnecessário aos desenvolvedores, é melhor publicar um container vazio — não prejudica ninguém.
Para publicar um contêiner, vá para a guia Workspace no Tag Manager e clique no botão Submit no canto superior direito:
Selecione Publicar e Criar Versão . Como esta é a primeira versão do seu contêiner, o campo Descrição da Versão pode ser deixado em branco. Em seguida, clique em Publicar :
Feito. O contêiner foi publicado.
4. Confira o Gerenciador de tags do Google
Depois de adicionar o código do Gerenciador de tags ao seu site, você pode verificar se os dados estão sendo transferidos corretamente usando a extensão especial do Assistente de tags do Google. Esta é uma adição ao navegador Chrome que mostra quais tags de produtos do Google estão instaladas em seu site e como elas funcionam.
Depois de baixar e instalar o complemento, você verá este ícone na barra de ferramentas do Chrome
. Clique nele e selecione quais tags de sistema você deseja verificar e em quais páginas. Clique em Concluído .
Em seguida, vá para a página que deseja verificar e clique no ícone Tag Assistant. Para ativar a extensão, clique em Ativar :
Atualize a página atual e o Tag Assistant mostrará quais tags estão instaladas na página e como estão funcionando. Um ícone verde indica que os dados estão sendo transmitidos sem reclamações, azul indica que não há problemas críticos e vermelho indica problemas sérios:
Se você clicar em uma tag específica, verá as possíveis causas do erro e dicas sobre como corrigi-lo:
Mais informações sobre o Assistente de tags podem ser encontradas na Ajuda do Google.
Mais algumas dicas
Ao instalar o código GTM em seu site, peça ao desenvolvedor para adicionar o snippet do Google Optimize ao mesmo tempo. Essa é uma boa ideia, mesmo que você não vá experimentar o conteúdo do seu site no momento. Sempre que você quiser realizar um teste A/B, tudo estará pronto.
Esse snippet de código é necessário para carregar o contêiner do Google Optimize de forma assíncrona e não mostrar a página original até que o contêiner seja carregado. Com o snippet do Optimize, os usuários não verão o conteúdo original da página até que a página com as alterações em seu teste seja carregada.
Ao transferir tags que você injetou manualmente no Google Tag Manager, não se esqueça de removê-las do código no site para que os dados não sejam duplicados. esse é um ponto importante.
Qual é o próximo
Após instalar o código em seu site, você precisa adicionar e configurar tags e variáveis na interface do Tag Manager. Para saber como fazer isso, consulte o artigo O que é o Google Tag Manager e como configurar o Google Analytics com ele ou o webinar Um passo à frente: técnicas e sutilezas de trabalhar com o Google Tag Manager.
PS Preparamos um checklist de 20 passos que devem ser executados pelos analistas de marketing para tomar decisões com base em dados corretos e completos. Preencha o formulário e enviaremos a lista de verificação por e-mail.