# Como taguear um Banner no Site?

## Introdução

Este guia irá te ajudar a taguear o banner que você deseja rastrear a quantidade de cliques e precisa acompanhar o comportamento do usuário, seja um banner de campanha ou institucional. Para isso você precisa utilizar a ferramente Google Tag Manager. Siga as instruções e etapas a seguir.&#x20;

### Pré-requisitos

* Acesso como Administrador do Google Tag Manager e conhecimento intermediário da ferramenta;
* Acesso como Administrador do Google Analytics 4 e conhecimento intermediário da ferramenta;
* Apoio de uma agência de marketing ou equipe especializada;&#x20;
* Antes de iniciar essa configuração, será necessário concluir a instalação do código do Google Tag Manager no Site. Veja como instalar através desse tutorial: [como-instalar-o-codigo-do-google-tag-manager](https://omnibees.gitbook.io/portugues-br/google-tag-manager/como-instalar-o-codigo-do-google-tag-manager "mention")

### Etapa 1: Copiar o Identificador do Banner

1. Acesse o site que deseja taguear o banner;
2. Clique com o botão direito no banner desejado;
3. Após clicar, abrirá uma caixa com as opções. Clique em **Inspecionar;**

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FoSetgJK5XWtQgjU54pAn%2Fimage.png?alt=media&#x26;token=293fa1e3-9f2c-4253-8d28-8cf96e390b68" alt=""><figcaption></figcaption></figure>

4. Após inspecionar, você verá um código que representa o **Click Class** do Banner (grifado em azul no print abaixo). **Copie esse código**

{% hint style="warning" %}
**Atenção**: este código que aparece no print abaixo será diferente do que voce está vendo em sua tela. Este é apenas um exemplo
{% endhint %}

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2Fmx23KrZ89xG7ptJscme6%2FCaptura%20de%20tela%202023-11-22%20154328.jpg?alt=media&#x26;token=56104b17-549d-4289-b1ec-8aef8cf46aff" alt=""><figcaption></figcaption></figure>

### Etapa  2: Criar a tag no Google Tag Manager

1. Acesse a conta do seu Google Tag Manager;
2. Clique em **Tags;**
3. No canto direito superior, clique em **Nova;**
4. Ao abrir a nova tag, siga as instruções:

Configuração da tag:

* Tipo da tag: **Google Analytics: evento do GA4**
* ID da métrica: inserir o **ID da métrica do GA4**. Você pode localizar o ID em **Google Analytics 4 > Administrador > Stream de Dados > Fluxo de Dados > ID da métrica**
* Nome do evento: coloque o nome que desejar

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FuxKJioTuHLQyr6SP6xVu%2Fimage.png?alt=media&#x26;token=3125ec75-63cf-4ce8-bc9f-d2a601d22342" alt=""><figcaption></figcaption></figure>

Acionamento:

* Clique sobre o acionador para criá-lo;

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FP6RxaSjtLtrjqE3AnLQI%2Fimage.png?alt=media&#x26;token=8d811e87-db11-42bb-9231-4ebdcb39aea6" alt=""><figcaption></figcaption></figure>

* No canto direito superior, clique no sinal de **+** para criar;

<div align="left"><figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FLiefTGwUT5Y5d7wkDWmL%2Fimage.png?alt=media&#x26;token=e3c1ba83-ed19-4361-b018-f5203680c8a3" alt=""><figcaption></figcaption></figure></div>

* Na configuração do **Acionador**, clique em **Todos os elementos;**

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2Fc5SSKc32UsCEQSSHNPQY%2FCaptura%20de%20tela%202023-11-22%20155334.png?alt=media&#x26;token=d8fb5d12-406f-4e29-82c4-ca8a1df26754" alt=""><figcaption></figcaption></figure>

* Selecione a opção **Alguns cliques;**

<div align="left"><figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FH4xlm88P6JxYTYPw1dkN%2Fimage.png?alt=media&#x26;token=48c6c224-668a-4045-ae00-494ce05f95a6" alt=""><figcaption></figcaption></figure></div>

* Selecione o evento **Click Classes** com a condição **Contem**. No campo em branco cole aquele código que você copiou em Inspecionar no console do navegador;

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FokUMYyD1zeqyuqMwZmuS%2Fimage.png?alt=media&#x26;token=417c9d10-e5ff-4de8-9c3c-28a57f528056" alt=""><figcaption></figcaption></figure>

* Após configurar, crie um nome para o Acionador e clique em **Salvar;**

### Etapa 3: Testar

Após criar a tag do banner, agora é hora de testar com o **Tag Assistant**

1. No canto direito superior do GTM, clique em **Visualizar;**
2. Insira o domínio do site e clique em **Conectar;**

<div align="left"><figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FQ0qHdxD87CLVZT3nX6qT%2Fimage.png?alt=media&#x26;token=38cb9370-2889-4bf9-b0c7-c3cf1ef57b77" alt="" width="554"><figcaption></figcaption></figure></div>

3. Ao entrar no seu site com o Tag Assistant, clique no banner que deseja traquear
4. Após clicar no banner, acesse a aba do Tag Assistant que está aberta e clique em **Continuar**

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2F0L0dGAyPXJeTUeQCJTpq%2Fimage.png?alt=media&#x26;token=baf4218a-cab2-46b8-b975-cb6a1c7981e9" alt=""><figcaption></figcaption></figure>

5. Veja pelo debug que através do evento do **Click** no banner foi confirmado e a tag foi disparada.

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FRAHvuBgKpOKwXOYThKcz%2FCaptura%20de%20tela%202023-11-22%20162134.jpg?alt=media&#x26;token=6c972560-be99-4f08-86de-bd1f5a6d993e" alt=""><figcaption></figcaption></figure>

### Onde acompanhar?

#### Relatório de Eventos

* Acesse a conta do GA4;
* No menu lateral esquerdo, clique em **Relatórios;**
* Clique em **Interação** e selecione o relatório de **Eventos;**

{% hint style="info" %}
**Relatório de Eventos:** neste relatório você poderá acompanhar o desempenho desses eventos que ocorrem no seu site. Basta sobre o evento criado e irá aparecer um relatorio com mais detalhes. Após configurar o tagueamento do banner, deve aguardar no dia seguinte para visualizar o evento neste relatório.
{% endhint %}

<figure><img src="https://4149059161-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MhYoKq5iUEw2YxKyBxg%2Fuploads%2FCySGHb0krkcuxTTXd3UR%2Fimage.png?alt=media&#x26;token=29304f1c-efb3-4f7d-a6e1-bc4c6cdd0d48" alt=""><figcaption></figcaption></figure>

#### Relatório de Funil de Conversão

Você também pode criar um funil de conversão para acompanhar a jornada de usuário que clicaram no banner e confirmaram a reserva. Basta utilizar o evento criado neste manual e configurar seguindo o manual abaixo

[como-configurar-o-funil-no-google-analytics-ga4](https://omnibees.gitbook.io/portugues-br/google-analytics/como-configurar-o-funil-no-google-analytics-ga4 "mention")
