Para que seja possível realizar a configuração de eventos no Tagmanager é necessário que você já tenha configurado o Google Analytics via Tag Manager, caso você ainda não tenha configurado, basta seguir o artigo abaixo da nossa base de conhecimento:
- Configurando o Google Analytics via TagManager
O que é Data Layer?
O Data Layer é um dos principais conceitos do Google Tag Manager e que garante o máximo de flexibilidade, portabilidade e facilidade de implementação.
Sem ele, o GTM não funcionaria. O Data Layer é o que mantém o gerenciamento de tags funcionando corretamente. E funciona como sendo a chave que ativa todo o potencial do Gerenciador de Tags do Google.
O Data Layer também é conhecido como Camada de Dados.
Resumindo, a camada de dados é como uma pasta que você guarda certas informações.
É um local central (camada virtual) de um site onde você, seus desenvolvedores ou ferramentas de terceiros podem armazenar dados/informações temporariamente (sobre o usuário, conteúdo da página, informações de um produto, ações, etc.).
O Google Tag Manager lê as informações, usa-as em tags, acionadores e variáveis ou as envia para outras ferramentas, como Google Analytics, Google Ads, Facebook, etc, podendo inclusive adicionar mais informações se necessário.
O que são eventos do Google Tag Manager?
Os eventos do Google Tag Manager nada mais são do que configurações de acionador disparadas em resposta de um tipo de ação dentro de um site, como por exemplo, cliques em links, envio de formulário, tempo de permanência na página, etc…
Para fazer a configuração desses eventos, é necessário que você tenha uma contêiner do Google Tag Manager no seu site e também, uma propriedade no Google Analytics.
Basicamente, você irá criar o evento no GTM e mensurar os resultados no GA.
Temos disponíveis os seguintes eventos no DataLayer na plataforma:
Sign_up :
Variáveis disponíveis: state, city, method;
Add_to_cart:
Variáveis disponíveis: currency, affiliation, brand, category, coupon, id, location_id, name, price, price_discounted, sku, value,
Begin_checkout:
Variáveis disponíveis: id, value, coupons, shippings, market_place_taxes, seller_taxes, payment_methods, items, city, state
View_item:
Variáveis disponíveis: currency, affiliation, brand, category, coupon, id, location_id, name, price, price_discounted, sku, value,
Add_payment_info:
Variáveis disponíveis:
View_cart:
Variáveis disponíveis: id, value, coupons, shippings, market_place_taxes, seller_taxes, payment_methods, items, city, state
Purchase:
Variáveis disponíveis: ids, value, coupons, shippings, market_place_taxes, seller_taxes, payment_methods, items
Criando evento Purchase (evento de compra) no Google TagManager:
Acesse sua conta do Google TagManager ~> https://tagmanager.google.com/
Clique em Adicionar um nova tag:
Em seguida dê um nome para tag, no exemplo utilizaremos GA4 - Purchase, para facilitar a identificação, e clique na área Configuração da Tag:
Selecione o tipo da tag “Google Analytics Evento do GA4”:
Após selecionar o tipo de tag, e retornar a tela para as configurações da tag, é necessário informarmos três campos:
Tag de configuração: “Nenhum, definir código manualmente”
Id da Métrica: Id da Métrica criada no Google Analytics
Nome do Evento: Purchase
Descendo a tela, iremos configurar os parâmetros de eventos conforme a tela abaixo:
A coluna Valor, recebe as variáveis do Data Layer (Camada de dados), é necessário configurar todas as variáveis do evento, apenas uma única vez, ou seja, as variáveis utilizada no evento Purchase podemos utilizar em outros eventos. Para criarmos as variáveis, basta clicar no botão de adição na frente do nome do parâmetro:
Defina um nome para a variável, de uma forma amigável, exemplo “dtl - value”, queremos obter o valor do pedido, neste caso. Após isso, clique na área de Configuração da Variável:
Escolha o tipo Variável de Camada de Dados:
Próximo passo, definir o nome da variável de camada de dados, esse é um ponto muito importante e requer atenção:
Para sabermos informar o nome da variável da camada de dados, iremos o tagAssistant, para visualizarmos o datalayer, para isso abra o Tagmanager em outra aba no navegador, clique em Visualizar, conforme imagem abaixo:
Clique em “Connect”:
A sua plataforma abrirá em outra aba, com o código do tagmanager na frente da URL, conforme exemplo abaixo:
Mantenha aberto a plataforma, logue com um cadastro de comprador (lembre-se, estamos configurando o evento de pedido (purchase), para isso precisamos efetuar um pedido de teste.
Adicionei um produto no carrinho, e vou seguir para finalizar o pedido:
Veja na outra aba do TagAssistant, todas as ações realizadas na plataforma estão sendo visualizadas:
Voltando para o pedido, realizamos um pedido via boleto para configurarmos e testarmos o evento purchase:
Com isso, foi capturado o evento purchase da camada de dados no Tag Assistant, veja:
Clicando no nome do evento purchase em seguida em datalayer, será exibido as informações do pedido:
Cada parâmetro dentro de object pode ser utilizado na variável de camada de dados.
Voltando para a aba de configuração da Tag, no TagManager, estávamos configurando a variável “value”, ou seja, o valor total do pedido. A tela até o momento está dessa forma:
A variável value, está dentro de object no dataLayer, conforme a imagem anterior.
Nossa variável value ficará assim:
object.value
A configuração da variável ficou dessa maneira:
A tela de configuração da Tag, ficou dessa forma:
Obs: Repetimos os passos de criação de variável para os parâmetros shipping e items.
Descendo com o scroll do mouse nessa tela de configuração da Tag, temos que configurar o último passo, o Acionamento:
Clicando no ícone de adição, iremos criar um novo Acionador para o evento Purchase
Iremos dar o nome de Acionador - Purchase, e clicar na área de Configuração:
Selecione Evento Personalizado:
Nome do evento deverá ser o mesmo nome do evento do datalayer, neste caso purchase, e basta clicar em salvar.
Por fim, na tela de configuração da Tag, vamos clicar também em salvar:
Próximo passo é clicar em Enviar, para propagar a tag criada:
Caso queira fazer controle de versão, ou descrever o que criou pode utilizar os campos da tela abaixo, e por fim clicar em Publicar:
A sua tag para o evento Purchase foi criada com sucesso no TagManager ! \o/
Próxima e última etapa, iremos criar o evento personalizado purchase no Google Analytics, para receber as informações da tag que criamos no TagManager.
Acessando o Google Analytics, clique na opção Administrador:
Clique na opção “Eventos” :
Criar Eventos:
Preencher os campos setados, conforme o evento a ser criado, no exemplo acima estamos seguindo a criação do purchase. Após preencher basta clicar em “Salvar”.
Dessa forma concluímos todo o processo de configuração do evento purchase, enviando as informações do datalayer para o container no Google TagManager, através da Tag criada enviamos as informações para o Google Analytics, para que seja possível visualizar as métricas de monetização.
Para configurar os outros eventos disponíveis basta seguir o passo-a-passo do artigo, alterando-se apenas o nome dos eventos e seus respectivos parâmetros. Recomendamos sempre buscar auxílio com um profissional capacitado ou empresa na área de Marketing Digital e/ou Gestão de Tráfego.