Neste artigo, veremos o passo a passo das configurações que deverão ser inseridas diretamente no Google Tag Manager para que sua campanha de Remarketing do Google Ads funcione corretamente.
Avisos:
- O primeiro passo e um dos mais importantes é você realizar a criação da variavel nonce dentro do seu Google Tag Manager, para isso confira nosso artigo com o passo a passo clicando aqui.
- É preciso que tenha uma conta ativa junto ao Google Ads e também junto ao Google Tag Manager;
- Não se esqueça que é necessário reivindicar a propriedade de seu domínio, para utilizar as ferramentas do Google, caso ainda não tenha feito, siga as instruções deste outro artigo;
⚠️Atenção: Atualmente a equipe de atendimento da Tray não presta auxilio para campanhas de remarketing com Google Ads. Desta maneira, orientamos que realize essas edições apenas se tiver conhecimento em programação. Caso contrário, recomendamos a contratação de algum profissional especializado ou agência parceira.
Seguem as configurações que realizaremos neste artigo.
Então vamos às configurações:
- Variáveis
Atenção: Caso já tenha seguido o artigo Google Ads - Acompanhamento de Conversão e realizado suas configurações, clique aqui para pular as variáveis que se repetem para ambas as configurações. Caso ainda não tenha seguido o artigo citado anteriormente, siga as instruções à seguir.
Ao acessar o contêiner já reivindicado no Google Tag Manager como descrito anteriormente, acesse no menu lateral esquerdo a opção "Variáveis", e clique em "Nova" para criar uma nova variável, como demonstrado no print a seguir.
Atenção: A imagem acima se trata de uma tela do Google Tag Manager e não do painel administrativo Tray. Todas estas configurações deverão ser realizadas no próprio Google Tag Manager.
- Para escolher o tipo da variável, basta clicar na bola do centro e depois ao lado direito escolha o tipo, de acordo com as informações deste manual, como você verá mais abaixo (os tipos de Acionador e Tag são criados da mesma forma):
Agora que explicamos como realizar o procedimento de criação de uma nova variável e como selecionar o seu tipo, vamos ver as configurações de cada uma delas para que possamos criá-las corretamente!
Primeira Variável: transactionTotal
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: ecommerce.purchase.actionField.revenue
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: transactionTotal
- Salve o nome e a variável transactionTotal estará criada como segue:
Segunda Variável: checkoutTotal
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: checkoutTotal
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: checkoutTotal
- Salve o nome e a variável checkoutTotal estará criada como segue:
Terceira Variável: UserID
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: userId
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: userId
- Salve o nome e a variável userId estará criada como segue:
Quarta Variável: idProduct
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: idProduct
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: idProduct
- Salve o nome e a variável idProduct estará criada como segue:
Quinta Variável: pageCategory
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: pageCategory
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: pageCategory
- Salve o nome e a variável pageCategory estará criada como segue:
Sexta Variável: priceSell
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: priceSell
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: priceSell
- Salve o nome e a variável priceSell estará criada como segue:
Sétima Variável: OrderData
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: ecommerce.purchase
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: OrderData
- Salve o nome e a variável OrderData estará criada como segue:
Oitava Variável: google_tag_params
- Acesse Variáveis » Nova, escolha o tipo "Variável da camada de dados"
- Em "Nome da variável da camada de dados", insira: google_tag_params
- Em "Versão da camada de dados", selecione: Versão 2
- Clique em "Salvar" e dê o seguinte nome para a variável: google_tag_params
- Salve o nome e a variável google_tag_params estará criada como segue:
Até aqui configuramos todas as variáveis necessárias para o Remarketing do Google Ads, agora vamos para a próxima etapa, que é a configuração dos Acionadores!
- Acionadores
Atenção: Caso já tenha seguido o artigo Google Ads - Acompanhamento de Conversão e realizado suas configurações, clique aqui para pular os acionadores que se repetem para ambas as configurações. Caso ainda não tenha seguido o artigo citado anteriormente, siga as instruções à seguir.
Logo acima do acesso às Variáveis no menu esquerdo do Google Tag Manager, encontraremos os Acionadores! Acesse a opção "Acionadores", e clique em "Novo" para criar um novo acionador, como demonstrado no print a seguir:
- Para selecionar o tipo do acionador, assim como nas variáveis, clique no ícone central para acessar os tipos, como demonstrado a seguir:
Agora que explicamos como realizar o procedimento de criação de um novo Acionador e como selecionar o seu tipo, vamos ver as configurações de cada um deles para que possamos criá-los corretamente!
Primeiro Acionador: EasyCheckout_OrderPlaced
- Acesse Acionadores » Novo, escolha o tipo "Evento Personalizado"
- Em "Nome do evento", insira: purchase
- Em "Este acionador é disparado em", selecione: Todos os eventos personalizados
- Clique em "Salvar" e dê o seguinte nome para o acionador: EasyCheckout_OrderPlaced
- Salve o nome e o acionador EasyCheckout_OrderPlaced estará criado como segue:
Segundo Acionador: EasyCheckout_Confirmation
- Acesse Acionadores » Novo, escolha o tipo "Evento Personalizado"
- Em "Nome do evento", insira: EasyCheckout_Confirmation
- Em "Este acionador é disparado em", selecione: Todos os eventos personalizados
- Clique em "Salvar" e dê o seguinte nome para o acionador: EasyCheckout_Confirmation
- Salve o nome e o acionador EasyCheckout_Confirmation estará criado como segue:
Terceiro Acionador: DOM pronto
- Acesse Acionadores » Novo, escolha o tipo "Exibição de página"
- Em "Este acionador é disparado em", selecione: "Todas as exibições de página"
- Clique em "Salvar" e dê o seguinte nome para o acionador: DOM pronto
- Salve o nome e o acionador DOM pronto estará criado como segue:
Quarto Acionador: fireRemarketingTag
- Acesse Acionadores » Novo, escolha o tipo "Evento Personalizado"
- Em "Nome do evento", insira: fireRemarketingTag
- Em "Este acionador é disparado em", selecione: Alguns eventos personalizados
- Em "Disparar este acionador quando ocorrer um evento e todas essas condições forem verdadeiras" configure da seguinte forma:
- Event
- É igual a
- Insira: fireRemarketingTag
- Clique em "Salvar" e dê o seguinte nome para o acionador: fireRemarketingTag
- Salve o nome e o acionador fireRemarketingTag estará criado como segue:
Certifique-se de que configurou corretamente os quatro (4) acionadores conforme imagens e informações acima, somente assim o Remarketing do Google Ads irá funcionar corretamente.
Quinto acionador: Cart
- Acesse Acionadores » Novo, escolha o tipo "Evento Personalizado"
- Em "Nome do evento", insira: cart
- Em "Este acionador é disparado em", selecione: Alguns eventos personalizados
- Em "Disparar este acionador quando ocorrer um evento e todas essas condições forem verdadeiras" configure da seguinte forma:
- Event
- É igual a
- Insira: cart
- Clique em "Salvar" e dê o seguinte nome para o acionador: Cart
- Salve o nome e o acionador Cart estará criado como segue:
- Tags
Atenção: Caso já tenha seguido o artigo Google Ads - Acompanhamento de Conversão e realizado suas configurações, clique aqui para pular as Tags que se repetem para ambas as configurações. Caso ainda não tenha seguido o artigo citado anteriormente, siga as instruções à seguir.
Logo acima do acesso aos Acionadores no menu esquerdo do Google Tag Manager, encontraremos as Tags! Acesse a opção "Tags", e clique em "Nova" para criar uma nova Tag, como demonstrado no print a seguir:
Para as Tags, é necessário configurar a Tag e também selecionar o Acionador que fará o disparo desta Tag nas páginas de sua loja, enquanto que as variáveis que criamos anteriormente, serão vinculadas na configuração de cada uma das 3 Tags que criaremos.
- Clique no ícone central do campo "Configuração da tag" para acessar os tipos de Tag, como demonstrado a seguir:
Atenção: Para a configuração das Tags a seguir, será necessário que tenha em mãos o "Código de Conversão" e o "Rótulo de Conversão" obtidos em sua conta do Google Ads.
- Acesse em sua conta do Google Ads as seguintes opções: Ferramentas » Conversões » Clique no nome da conversão » Selecione a opção "Configuração da Tag" » Clique na opção "Usar o Gerenciador de tags do Google"
- Neste local serão apresentados ambos os dados que deverão ser inseridos nos campos indicados nas configurações das Tags a seguir.
Primeira Tag: Global site Ads
- Acesse Tags » Nova, escolha o tipo "HTML Personalizado"
- Em "HTML", insira o código a seguir:
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-9999999999"></script>
<script nonce="{{nonce}}">
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-9999999999');
</script>
Selecione a opção: Suporte para document.write
Importante: É necessário alterar os códigos destacados em vermelho (AW-9999999999) no código apresentado anteriormente pelo seu próprio "Código de Acompanhamento Google Ads", para que a Tag dispare para o Google Ads de sua loja corretamente. Caso não saiba que código é este clique aqui e veja como consegui-lo.
- Em Acionamento, clique no ícone central e escolha o acionador "Todas as Páginas (All pages)".
- Clique em "Salvar" e dê o seguinte nome para a Tag: Global site Ads
- Salve o nome e a tag Global site Ads estará criada como segue:
Segunda Tag: userId Remarketing
- Acesse Tags » Nova, escolha o tipo "HTML Personalizado"
- Em "HTML", insira o código a seguir:
<script nonce="{{nonce}}">
gtag('event', 'page_view', {
'send_to': 'AW-9999999999',
'local_pagetype': 'conversionintent',
'local_totalvalue': {{transactionTotal}} || {{checkoutTotal}},
'user_id': {{userId}}
});
</script>Selecione a opção: Suporte para document.write
Importante: É necessário alterar os códigos destacados em vermelho (AW-9999999999) no código apresentado anteriormente pelo seu próprio "Código de Acompanhamento Google Ads", para que a Tag dispare para o Google Ads de sua loja corretamente. Caso não saiba que código é este clique aqui e veja como consegui-lo.
- Em Acionamento, clique no ícone central e escolha o acionador: EasyCheckout_Confirmation
- Clique no botão + e inclua o segundo acionador: EasyCheckout_OrderPlaced
- Clique em "Salvar" e dê o seguinte nome para a Tag: userId Remarketing
- Salve o nome e a tag Global site Ads estará criada como segue:
Terceira Tag: Remarketing do Google Ads
- Acesse Tags » Nova, escolha o tipo "Remarketing do Google Ads"
- Em "Código de conversão", insira seu Código de Conversão Google Ads
- Em "Rótulo de conversão" insira o seu Rótulo de Conversão Google Ads
- Em "Parâmetros personalizados" selecione a opção "Usar camada de dados"
- Em "Variável das camadas de dados" selecione : {{google_tag_params}}
- Em Acionamento, clique no ícone central e escolha o acionador: fireRemarketingTag
- Clique em "Salvar" e dê o seguinte nome para a Tag: Remarketing do Google Ads
- Salve o nome e a tag Remarketing do Google Ads estará criada como segue:
Quarta Tag: Remarketing do Google Ads - Variáveis
- Acesse Tags » Nova, escolha o tipo "HTML Personalizado"
- Em "HTML", insira o código a seguir:
<script nonce="{{nonce}}">
var pagina = {{pageCategory}};(function() {
try {if (pagina == 'Produto') {
var prodid={{idProduct}}, totalvalue={{priceSell}};
prodid = JSON.parse(prodid);
dataLayer.push({
'event': 'fireRemarketingTag',
'google_tag_params': {
'ecomm_prodid': prodid,
'ecomm_pagetype': 'product',
'ecomm_totalvalue': totalvalue}});
} else if ( pagina == 'Carrinho' ) {
var products = dataLayer.map(function (elem) {
return elem['ecommerce'];
}).filter(function (valor) {
valor != "undefined"; return valor;
}).slice(-1)[0].checkout.products;
var totalvalue = 0;
if ((products.length - 1) == 0) {
var prodid = products[0]['id'];
prodid = JSON.parse(prodid);
} else {var prodid = '[';
for (var i = 0; i <= products.length - 1; i++) {
prodid += products[i]['id'];
totalvalue = products[0]['price'] * products[0]['quantity'];
if (i !== products.length - 1) {
prodid += ',';}}; prodid += ']';
prodid = JSON.parse(prodid);}
dataLayer.push({
'event': 'fireRemarketingTag',
'google_tag_params': {
'ecomm_prodid': prodid,
'ecomm_pagetype': 'cart',
'ecomm_totalvalue': totalvalue}});
} else if ( pagina == 'Busca' ) {
var products = dataLayer[0]["listProducts"];
if ((products.length - 1) == 0) {
var prodid = products[0]['idProduct'];
prodid = JSON.parse(prodid);
} else {var prodid = '[';
for (var i = 0; i <= products.length - 1; i++) {
prodid += products[i]['idProduct'];
if (i !== products.length - 1) {
prodid += ',';}}; prodid += ']';
prodid = JSON.parse(prodid);}
dataLayer.push({
'event': 'fireRemarketingTag',
'google_tag_params': {
'ecomm_prodid': prodid,
'ecomm_pagetype': 'search'}});
} else if ( pagina == 'catalogo' ) {
var products = dataLayer[0]["listProducts"];
if ((products.length - 1) == 0) {
var prodid = products[0]['idProduct'];
prodid = JSON.parse(prodid);
} else {var prodid = '[';
for (var i = 0; i <= products.length - 1; i++) {
prodid += products[i]['idProduct'];
if (i !== products.length - 1) {
prodid += ',';}}; prodid += ']';
prodid = JSON.parse(prodid);}
dataLayer.push({
'event': 'fireRemarketingTag',
'google_tag_params': {
'ecomm_prodid': prodid,
'ecomm_pagetype': 'catalog'}});
} else {
dataLayer.push({
'event': 'fireRemarketingTag',
'google_tag_params': {
'ecomm_pagetype': pagina
}});}} catch (err) {}})();
</script>
Selecione a opção: Suporte para document.write
- Em "Acionamento", clique no ícone central e escolha o acionador: DOM pronto
- Clique no botão + e inclua o segundo acionador: Cart
- Em "Adicionar exceção" selecione "EasyCheckout_OrderPlaced"
- Clique em "Salvar" e dê o seguinte nome para a Tag: Remarketing do Google Ads - Variáveis
- Salve o nome e a tag Remarketing do Google Ads - Variáveis estará criada como segue:
Quinta Tag: Remarketing do Google Ads - Variáveis Checkout
- Acesse Tags » Nova, escolha o tipo "HTML Personalizado"
- Em "HTML", insira o código a seguir:
<script nonce="{{nonce}}">
var OrderData = {{OrderData}};(function() { try {
var totalvalue = OrderData.actionField.revenue;
var products = OrderData.products;
if ((products.length - 1) == 0) {
var prodid = products[0]['id'];
prodid = JSON.parse(prodid);
} else {var prodid = '[';
for (var i = 0; i <= products.length - 1; i++) {
prodid += products[i]['id'];
if (i !== products.length - 1) {
prodid += ',';}};
prodid += ']';
prodid = JSON.parse(prodid);}
dataLayer.push({
'event': 'fireRemarketingTag',
'google_tag_params': {
'ecomm_prodid': prodid,
'ecomm_pagetype': 'purchase',
'ecomm_totalvalue': totalvalue } });
} catch (err) {}
})();
</script>
Selecione a opção: Suporte para document.write
- Em "Acionamento", clique no ícone central e escolha o acionador: EasyCheckout_OrderPlaced
- Clique em "Salvar" e dê o seguinte nome para a Tag: Remarketing do Google Ads - Variáveis Checkout
- Salve o nome e a tag Remarketing do Google Ads - Variáveis Checkout estará criada como segue:
- Enviando os dados
Pronto! Finalizamos as configurações das Variáveis, Acionadores e Tags necessárias para esta integração e agora é importante que você publique estas configurações para que sua loja dispare os dados que criamos acima.
- Acesse no menu superior do Google Tag Manager, no canto direito o botão "Enviar", como segue na imagem a seguir:
- Na tela a seguir deixe configurado para "Publicar e criar versão" e então clique em "Publicar", como segue:
- Caso queira dar um nome e inserir uma breve descrição do que foi configurado nesta versão, poderá incluir nesta etapa, e então, basta clicar em "Continuar" para finalizar a publicação e carregar estas Tags em sua loja.
Pronto! utilizando as configurações acima, a integração irá operar corretamente, lembrando que é preciso que valide se todos os itens acima foram configurados corretamente em seu Google Tag Manager, para que possa garantir o seu devido funcionamento!
Boas Vendas!
Equipe Tray.