Todas as coleções
Construtor/Builder
Elementos
Como definir conversões de cliques de botão pelo Google Tag Manager no RockFunnels
Como definir conversões de cliques de botão pelo Google Tag Manager no RockFunnels

Como disparar eventos, tags, pixels e conversões por clique de botão via Google Tag Manager

Sinésio Alves avatar
Escrito por Sinésio Alves
Atualizado há mais de uma semana

Dependendo do seu nicho de negócio, às vezes é necessário marcar conversões ou disparar eventos de rastreamento quando o usuário clica em algum botão específico da página.

Um exemplo clássico disso é quando se faz campanhas para negócios locais, onde a conversão desejada é quando o visitante clica em um botão para ser redirecionado para um atendimento por Whatsapp para agendamento ou fechamento de uma venda. Esse “clique no botão” é a ação desejada que deve ser metrificada como uma conversão.

Para configurar isso (e muito mais) via Google Tag Manager, siga os passos abaixo:

Instalando o Google Tag Manager na Página

Certifique-se de que a tag do Google Tag Manager esteja instalada na página. Para instalar a tag, entre no construtor do RockFunnels e abra o menu superior CONFIGURAÇÕES > PIXELS > Habilite a chave GOOGLE TAG MANAGER e insira a tag. Exemplo: GTM-N9HMN7H

Configurando o Google Tag Manager

Agora que sua página já está conectada com o Google Tag Manager, é necessário configurar o que deve ser disparado por ele e quando isso deve ocorrer.

Nesse tutorial usaremos como exemplo um evento do Pixel do Facebook (Initiate Checkout) que deve ser disparado apenas quando houver clique em um botão específico da página. Mas você pode configurar o disparo de uma infinidade de conversões, como: tags do Google Analytics, tags do Google Ads, pixels, etc.

Configurando o que deve ser disparado no Google Tag Manager (tag)

Já dentro da sua conta do Google Tag Manager, clique na aba “Tags” e depois no botão “Novo” para criar uma tag. Tag, nada mais é, do que algo que deve ser disparado (tag, pixel, conversão, etc).

Defina um nome para sua tag no canto superior esquerdo e em seguida clique no campo “Tag Configuration”

Será aberta uma lista com uma série de tags possíveis de serem disparadas pelo Google Tag Manager. Note que o topo da lista é composto por serviços do próprio Google e que serviços de outras empresas ou de empresas concorrentes são deixados para a parte inferior da lista.

No caso do nosso exemplo, estamos configurando um evento do Pixel do Facebook, que é um concorrente do Google. Por isso, não existe essa opção na lista e nesse caso é necessário configurar uma tag com HTML customizado.


Na tela seguinte, insira o código do evento que deseja disparar pelo Google Tag Manager. No nosso exemplo, o código do Pixel do Facebook com o evento de “Iniciar Finalização de Compra” (InitiateCheckout).

Pronto, agora o que deve ser disparado já está configurado e falta configurar quando esse evento deve ser disparado.

Configurando quando a tag deve ser disparada no Google Tag Manager (gatilho)

Para definir o gatilho que acionará o disparado dessa tag quando houver um clique no botão desejado, primeiro devemos identificar esse botão de forma única no RockFunnels. Isso faz com que nenhum outro botão da página (caso haja mais botões) seja “confundido” pelo botão que queremos identificar como único.

Para isso, dentro do construtor do RockFunnels, selecione o botão desejado que irá disparar a tag no Google Tag Manager e clique no ícone de engrenagem para abrir o menu lateral. Navegue até a aba AVANÇADO > CSS CLASSES e defina uma classe de CSS única para esse botão. No nosso exemplo a classe única é “cssgtm”.

Agora que o botão já está identificado como único, devemos configurar o gatilho no Google Tag Manager (não esqueça de publicar sua página no RockFunnels para que as configurações surtam efeito).

Novamente dentro do Google Tag Manager, clique no campo “Triggering” (gatilho).

Na próxima tela clique no botão que possuí o símbolo de adicionar (+) no canto superior direito.

Defina um nome para o gatilho e em seguida clique em “Trigger Configuration” (configuração do gatilho).

Será aberta uma lista com todos os possíveis gatilhos de disparo que você pode usar dentro do Google Tag Manager.

No nosso exemplo, vamos usar a opção “All Elements” (todos os elementos) na subseção “Click”.

Em seguida vamos selecionar a opção “Some Clicks” (alguns cliques) e depois a opção “Choose Built-In Variables” no menu dropdown para selecionar a variável desejada que irá identificar o botão único em nossa página.

Será aberta uma lista com todas as variáveis do sistema do Google Tag Manager possíveis para disparar gatilhos.

Para nosso exemplo vamos usar a opção “Click Classes”, pois queremos identificar o botão único da página por meio da Classe CSS que configuramos no RockFunnels.

Na tela seguinte mantenha a opção “contains” (contém) no segundo menu dropdown e no terceiro campo insira o valor da Classe CSS que foi definida no RockFunnels como identificador único do botão.

No nosso exemplo, esse valor é “cssgtm”. Em seguida clique em “Salvar”.

Pronto, agora sua configuração já está pronta. Para concluir e submeter essa configuração para os servidores do Google, não se esqueça de clicar no botão “Submeter” e em seguida em “Publicar” no canto superior direito do seu Google Tag Manager.

A partir de agora, sempre que um visitante clicar (gatilho) no botão específico que foi configurado como único no RockFunnels e “linkado” ao Google Tag Manager, a tag ou evento configurado será disparada (tag).

Esse exemplo mostra como fazer isso com um evento do Pixel do Facebook e com cliques de botão, mas o Google Tag Manager é bastante poderoso. Sinta-se à vontade para explorar seu potencial.

Respondeu à sua pergunta?