Tag no GTM no Primeiro Page View

Recentemente tive um problema sobre como disparar uma tag somente na primeira visualização de uma página.

Neste artigo, exploramos como configurar o Google Tag Manager (GTM) para disparar uma tag apenas na primeira visualização de uma página. Isso é útil para evitar a contagem duplicada de eventos ou conversões em sessões onde o usuário revisita a mesma página várias vezes.

A abordagem detalhada inclui a criação de uma variável personalizada que rastreia a primeira visualização da página e um trigger condicional que garante que a tag seja ativada apenas uma vez por sessão. Ao seguir essas etapas, você pode melhorar a precisão dos dados coletados e otimizar a eficácia das suas campanhas de marketing.

Quando seria um caso de uso para isso?

As situações podem variar, mas em meu novo emprego tive que disparar uma tag para fins de remarketing. Por exemplo, a empresa quer mostrar anúncios de uma campanha de remarketing quando 7 dias se passam após o primeiro o pageview (ou qualquer outro evento). Pois eles não sabiam como rastrear esse primeiro evento.

Hora de usar cookies

Primeiro de tudo, o que são cookies? Simplificando, cookies são pequenos pedaços de informação que os sites armazenam no seu computador. Cookies contêm apenas pedaços de texto, nada mais. O texto pode ser um ID de usuário, ID de sessão ou qualquer outro texto. Se um site armazena um cookie no seu navegador com algum ID e, depois de um tempo, você retornou, esse cookie ajuda o site a identificar que você é o mesmo visitante.

Os cookies também podem armazenar algumas informações menos pessoais, por exemplo, o número de páginas visualizadas com aquele navegador específico. E é exatamente isso que faremos aqui hoje.

Em breve, explicarei como você pode definir, editar e excluir cookies com o Google Tag Manager. Se inscreva em minha newsletter para ser avisado quando eu publicar.

Também vale a pena mencionar que, além dos cookies, você também pode usar a Web Storage API no GTM.

Aqui está o plano:

• Quando um visitante chega em uma página (qualquer página do seu site onde o GTM é implementado), um código JavaScript será disparado.
• Esse código define o cookie contendo o número de visualizações de página que o visitante fez (em geral). Esse número não se limita a uma única sessão. Se um visitante no 1º dia fizer 5 visualizações de página e retornar após um mês, o número de visualizações de página (naquele cookie) mudará para 6 (se, é claro, esse cookie ainda estiver presente no navegador).
• Com o Google Tag Manager, vamos ler o valor do cookie e o usaremos para criar Triggers.

O script

Aqui está o código que irá incrementar o número de visualizações de página (armazenadas em um cookie) toda vez que uma página for carregada (não importa se as páginas são diferentes ou se um visitante está apenas clicando em Atualizar na mesma página).

<script>
  function setCookie(name, value, expires) {
    var cookie = name + "=" + value + "; path=/; domain=." + location.hostname.replace(/^www\./i, "");

    if (typeof expires !== "undefined") {
        var now = new Date();
        now.setTime(now.getTime() + expires * 24 * 60 * 60 * 1000);
        cookie += "; expires=" + now.toUTCString();
    }

    document.cookie = cookie;
}

function getCookie(name) {
    var cookies = document.cookie.split(";"),
        toReturn;

    for (var i = 0; i < cookies.length; i++) {
        var cookie = cookies[i].trim();
        if (cookie.indexOf(name + "=") === 0) {
            toReturn = cookie.substring((name + "=").length, cookie.length);
        }
    }

    return toReturn;
}

(function() {
    var pageviewCount = getCookie("pageviewCount");

    if (typeof pageviewCount === "undefined") {
        pageviewCount = 1;
    } else {
        pageviewCount++;
    }

    setCookie("pageviewCount", pageviewCount, 30);

})();
</script>

Por padrão, esse cookie é válido por 30 dias. Se você quiser modificar essa configuração, edite o número na 37ª linha do código.

O nome do cookie será pageviewCount.

Adicione o script mencionado acima ao modelo de tag Custom HTML no GTM e dispare em All Pages. Depois disso, vá para Variables e crie uma nova variável do tipo 1st Party Cookie com as seguintes configurações:

Ele retornará o número de visualizações de página que está armazenado naquele cookie.

Agora, é hora de testar. Habilite o modo de visualização e depuração (Preview) e atualize a página em que você está trabalhando. Clique em um evento do seu interesse e alterne para a guia Variables . Dê uma olhada mais de perto no cookie: cookie – pageview count. Ele deve conter “1”. Atualize a página e verifique a variável mais uma vez. Desta vez, ele deve conter “2”. Isso ocorre porque o JavaScript (que adicionamos à tag do tipo Custom HTML) está procurando um cookie chamado pageviewCount e, se encontrar um, ele incrementa seu valor em +1.

Se o valor da variável do 1st Party Cookie for undefined, verifique se seu Custom HTML foi disparado corretamente e se você inseriu o nome do cookie correto nas configurações da variável (ela diferencia maiúsculas de minúsculas. Apenas pageviewCount com C maiúsculo funcionará).

Durante o teste, você pode excluir esse cookie (e, portanto, iniciar o contador do 0) acessando a lista de cookies do seu navegador e excluindo-o. Estou usando o Chrome, então posso fazer isso acessando Menu (Três pontos) > More Tools > Developer Tools > Application > Cookies e encontrar o cookie pageviewCount. Clique nele e pressione o botão DELETE no seu teclado.

Atualize o trigger

Vamos voltar ao caso principal mencionado no começo deste artigo, como disparar uma tag somente na primeira visualização da página. Presumo que você já tenha um certo trigger em mente (pode ser uma Page View, um Click ou qualquer outra coisa). Vá nesse trigger e adicione uma condição adicional:

Isso significa que se um cookie for 1 (o que significa que é a primeira visualização de página) ou se o cookie ainda não foi criado, esse gatilho será ativado (claro, outras condições do trigger também devem ser atendidas).

Não se limite apenas a este caso

Com este código JavaScript, você também pode definir tags para disparar não apenas na primeira visualização de página, mas também apenas na 2ª, 3ª, etc. Tudo depende de você e do seu caso de uso. Para esse propósito, vou criar uma Receita GTM que pode ativar uma tag na 3ª visualização de página em diante.

Finalizando

Agora você aprendeu como usar cookies para disparar uma tag somente na primeira visualização de página. Na verdade, não foi necessário usar este script completo que contabiliza visualizações de página. Você poderia ter criado um cookie chamado moreThanOnePageViews e definido seu valor como true após a visualização inicial da página. Se o valor desse cookie for igual a false, sua tag deve disparar. Se o valor for true, isso significa que um visitante fez mais de uma visualização de página em seu site.

Sinceramente, escolhi a solução pageviewCounter aqui porque queria mostrar a você o que mais podemos fazer com cookies.

Mas não vamos nos limitar apenas a isto. Sinta-se à vontade para verificar outras soluções para obter mais ideias:

• Armazenar ID do usuário em um cookie
• Armazenar ID do afiliado em um cookie
• Armazenar as informações da campanha
• Armazenar os dados de consentimento do visitante para serem rastreados, etc.

Tem mais perguntas? Sinta-se à vontade para entrar em contato comigo ou faça uma pergunta abaixo.