4 razões pelas quais os engenheiros de dados odeiam o Google Tag Manager

GTM é um injetor de código. Os navegadores geralmente veem os injetores de código de forma negativa porque eles podem facilmente se tornar um elo fraco por meio do qual os hackers podem plantar códigos maliciosos em um site ou aplicativo. Como resultado, o GTM é bloqueado pela maioria dos bloqueadores de anúncios e ferramentas de privacidade do navegador. Estima-se que 42,7% dos usuários da Internet usam bloqueadores de anúncios, o que significa que você pode perder de 8% a 25% dos dados de tráfego do usuário se estiver usando o GTM. Se toda a sua pilha mar-tech for entregue por meio do GTM e estiver bloqueada, você enfrentará sérios desafios.

Durante anos, o Gerenciador de tags do Google (GTM) tornou mais fácil para profissionais de marketing e analistas instalar e gerenciar análises de terceiros e ferramentas de marketing em seus sites e aplicativos. Ele fornece uma plataforma centralizada que permite que membros não técnicos da equipe adicionem, editem e desativem tags sem precisar tocar no código-fonte. Isso significa que eles não precisam incomodá-lo para adicionar novas tags ou editar as existentes no caso de uma atualização.

Mas, como você sabe, colocar esse poder nas mãos de equipes não técnicas tem o potencial de sair pela culatra. Tudo o que eles injetam no aplicativo ou site via GTM ignora seus processos usuais de desenvolvimento e controle de qualidade, o que pode resultar em uma bagunça que a equipe de dados precisa limpar.

Portanto, embora o GTM seja uma ferramenta útil, suas deficiências são rapidamente aparentes para empresas modernas orientadas a dados. Os engenheiros de dados odeiam o GTM e por um bom motivo. Sua suscetibilidade a bloqueadores de anúncios e propensão ao uso indevido são apenas o começo. Aqui, detalharemos quatro dos principais motivos pelos quais o GTM e os engenheiros de dados não se dão bem e ofereceremos uma solução melhor.

1. GTM é uma ferramenta de injeção de código propensa a vulnerabilidades de segurança

Como o GTM é uma ferramenta de injeção de código, ele não é bloqueado apenas por bloqueadores de anúncios. Ele também abre seu site para exploração porque sua capacidade de inserir código pode abrir a porta para hackers. Se um hacker obtiver acesso à sua conta GTM, ele poderá causar estragos nos bastidores adicionando algumas linhas de código aparentemente inofensivo. Muitas vezes, esse código passa despercebido porque não afeta a aparência ou a funcionalidade do site/aplicativo.

Em alguns casos, seu site ou aplicativo móvel pode ser usado para exibir publicidade indesejada para gerar receita para o hacker ou pode redirecionar os visitantes para outros sites cheios de anúncios. Nos piores cenários, seu site/aplicativo pode ser explorado para roubar PII. Tanto a equipe Joom quanto a Securi documentaram muitos casos disso entre sua clientela.

A exploração de segurança como essa causa brechas que afetarão sua capacidade de fornecer dados de qualidade às equipes que precisam deles, e corrigir esses problemas é demorado e caro.

2. Tem suporte limitado para a variedade de ferramentas que as empresas orientadas a dados precisam

O Gerenciador de tags do Google fornece suporte nativo para anúncios e redes analíticas. Embora ofereça mais opções de suporte para sites, oferece suporte a menos de 12 ferramentas para aplicativos móveis. Portanto, quando se trata de integrações com ferramentas em sua pilha, o GTM simplesmente fica aquém. Para enviar eventos para ferramentas para coisas como teste A/B, nutrição, envolvimento do cliente e suporte, você terá que encontrar soluções alternativas para integrar ferramentas sem suporte.

Por exemplo, se você estiver gerenciando uma ferramenta orientada a eventos como o Mixpanel via GTM usando código personalizado, convém usar outra ferramenta orientada a eventos como o Intercom no futuro. Usar o GTM significa que você precisa escrever um código personalizado novamente para enviar os mesmos conjuntos de dados ao Intercom. E sempre que qualquer ferramenta atualizar sua API, você terá que voltar para atualizar seu código.

3. Diminui o desempenho do site

Se não for gerenciado adequadamente, o GTM pode adicionar um sério fardo de desempenho às suas propriedades digitais. Isso pode acontecer se o contêiner do gerenciador de tags tiver acumulado tags ao longo do tempo, talvez por meio de experimentação com diferentes editores ou integrações de recursos.

As instruções de implementação de muitos pixels de rastreamento de terceiros são apenas “certifique-se de que seja acionado em todas as páginas”. Portanto, usuários menos experientes do GTM geralmente adicionam mais e mais dessas tags com o gatilho padrão “todas as páginas – visualização de página”, que é executado bem no início do processo de renderização do navegador, enquanto ainda está carregando e analisando recursos críticos para o site real (como HTML, CSS, JS, imagens, vídeos, etc.). O que torna isso pior é que, por padrão, as tags são essencialmente tratadas como scripts separados. Assim, se houver 50 tags gerenciadas via GTM, o navegador agora tentará carregar uma página da Web e 50 scripts diferentes simultaneamente cada vez que um usuário visitar uma nova página.

Embora os usuários em máquinas de médio porte com uma conexão rápida à Internet possam não sofrer quedas severas de desempenho, os usuários em máquinas mais antigas/mais fracas ou dispositivos móveis com conexões mais lentas sofrerão. Para cada carregamento de página, esses dispositivos mais fracos farão o máximo que sua CPU permitir e, em seguida, enfileirarão o restante, travando a janela do navegador e tornando o site inoperável até que todo esse processamento seja concluído. Isso não apenas resulta em uma experiência de usuário terrível, mas também afeta suas pontuações de Core Web Vitals (especialmente o primeiro atraso de entrada), o que afetará inadvertidamente a classificação do site no Google.

Maximilian Werner , fundador da Obsessive Analytics Consulting , que tem experiência significativa trabalhando com GTM, viu isso em primeira mão. “Certa vez, tive um cliente em que o GTM fazia com que as páginas da Web congelassem por cerca de 10 segundos durante o carregamento porque tinham mais de 120 tags disparadas no carregamento da página. Dispositivos móveis basicamente travaram.”

4. É difícil gerenciar o estado do usuário em escala

O GTM usa uma variável de janela JS global chamada dataLayer para manter algo semelhante a um estado intermitente. Ele só pode acompanhar as variáveis ​​na página atual. Isso significa que ele não pode persistir o estado do usuário nas páginas do mesmo domínio, muito menos nos domínios.

Por exemplo, suponha que o processo de checkout de um site de comércio eletrônico esteja distribuído em quatro páginas: carrinho, informações pessoais, informações de pagamento e confirmação. Quando um usuário insere seu nome e e-mail na página de informações pessoais e você usa dataLayer.push({name: 'john doe', email: "johndoe@domain.com" })para armazenar essas informações manualmente ou por meio de código executado automaticamente pelo site de comércio eletrônico (se eles oferecerem integração com o GTM), você pode usar essas informações nessa página .

No entanto, quando o usuário navega para a próxima página, o dataLayeré apagado, pois é apenas uma variável de janela e você não terá mais acesso a essas informações. Para transportar os dados para a próxima página, você mesmo deve persistir os dados escrevendo JS personalizado para armazená-los em um cookie ou localStorage e, em seguida, lê-los na próxima página. Isso adiciona muito mais pontos de falha e impede que você considere adequadamente os usuários que ingressam em funis em diferentes estágios.

Como instalar o Meta Pixel com o Google Tag Manager (Facebook Pixel)

Observação: o Facebook renomeou-se para Meta, mas muitos dos recursos de seus sites permanecem marcados como recursos do Facebook. Por esse motivo, usaremos os dois nomes (pixel do Facebook e pixel meta) de forma intercambiável.

Se você usa publicidade paga para adquirir novo tráfego, provavelmente já está veiculando anúncios no Facebook. No entanto, se você não medir a eficácia de suas campanhas publicitárias. você queima dólares esperando que talvez algo esteja funcionando.

Se você usa anúncios do Facebook, precisa usar o Facebook Pixel para medir o sucesso de suas campanhas. A implantação do Pixel em seu site ajuda o Facebook a entender seu site e como os usuários interagem com ele. Por extensão, o Facebook entenderá como as conversões acontecem no seu site.

Uma conversão pode ser um envio de formulário de lead, evento de compra ou outra coisa (abordaremos esses exemplos aqui).

Sempre que um visitante fizer uma conversão, o pixel rastreará isso e usará esses dados para otimizar suas campanhas.

Neste guia, mostrarei como instalar o Meta Pixel com o Gerenciador de tags do Google (não apenas visualizações de página básicas, mas também outras coisas, como eventos). O tema é bastante extenso. Portanto, recomendo apertar o cinto e mergulhar nisso. Além disso, considere assinar meu boletim informativo para se manter atualizado com o GTM.

Este artigo abordará apenas as coisas essenciais a saber ao implantar o pixel do Facebook por meio do Gerenciador de tags do Google. Para um guia/tutorial mais detalhado, tenho lições extensas sobre FB Pixel + GTM em meu curso GTM para iniciantes .

E se você também quiser implementar o rastreamento do Facebook com GTM do lado do servidor (com a API de conversões do Facebook), explico isso no curso GTM intermediário/avançado .

Antes de continuarmos

Se você é novo no Gerenciador de tags do Google, recomendo que leia meu e-book gratuito “Gerenciador de tags do Google para iniciantes”  antes de continuar com esta postagem no blog sobre Meta Pixel.

Caso contrário, você se sentirá muito sobrecarregado.

Uma rápida introdução ao Meta Pixel (Facebook Pixel)

O Facebook Pixel é uma solução criada pelo Facebook que permite medir o comportamento do usuário/visitante em seu site. Essas informações podem ser usadas ainda para rastrear conversões, otimizar campanhas ou criar públicos com base nos dados que você envia.

Depois de colocar determinados trechos de código JavaScript em seu site (e ativá-los com base no comportamento do usuário/visitante), esses dados são enviados de volta ao Facebook. Não vou me aprofundar nas possibilidades (porque esta postagem do blog se concentra mais na implementação). Mas se você é novo no FB Pixel, pode obter mais informações aqui .

Em poucas palavras, usando o Facebook Pixel, você será capaz de:

• Crie públicos personalizados para fins de remarketing (por exemplo, redirecione para aqueles que rolaram pelo menos 50% e gastaram pelo menos um minuto ou aqueles que adicionaram um produto a um carrinho, mas não compraram).
• Acompanhe as conversões . As conversões são as ações que você deseja que seus usuários concluam no site devido à importância delas para o seu negócio. Isso pode ser inscrição, assinatura, compra etc. Ao rastrear as conversões, você pode informar ao Facebook que o visitante X concluiu ações específicas que se alinham com suas metas de negócios. Com essas informações, você também pode deduzir quais anúncios são mais eficazes para atingir suas metas e quais não são.
• Oportunidades adicionais de segmentação . Ao rastrear certas interações (como leads ou compras), você pode instruir o Facebook a encontrar públicos semelhantes (pessoas com comportamento de navegação semelhante aos seus públicos registrados) e exibir seus anúncios a eles com base naqueles que já converteram em seu site.

Vamos deixar tudo de lado e focar no lado essencial — implementação técnica: como adicionar o pixel do Facebook ao seu site com o Gerenciador de tags do Google, como enviar eventos, como implementar correspondência avançada, propriedades do usuário, etc.

Como obter o código Meta Pixel?

Para começar, acesse o gerenciador de negócios do Facebook e obtenha o Pixel ID. Vamos precisar desse ID de pixel nos próximos capítulos desta postagem no blog.

Isenção de responsabilidade: o Facebook está constantemente mudando a interface do usuário aqui. Portanto, há uma grande chance de minhas capturas de tela não corresponderem ao que você vê na interface. Certa vez, tive um caso em que quatro pessoas em minha oficina GTM viram diferentes versões da interface simultaneamente. Então, se você não encontrar uma determinada opção, continue procurando.

Clique no ícone Menu no canto superior direito e vá para Gerenciador de Eventos .

Em seguida, vá para  Fontes de dados e escolha o Pixel que você tem interesse em implantar.

Caso ainda não possua nenhum Pixel, clique em Configurar Pixel e siga todos os passos necessários.

Em uma das etapas, o Facebook oferece várias maneiras de adicionar o pixel. Vamos ver isso mais tarde.

Seu principal objetivo, por enquanto, é obter o Pixel ID que se parece com isso (claro, o valor será diferente):

O ID é apenas uma combinação de números. Depois de obtê-lo, copie-o (porque precisaremos dele no próximo capítulo desta postagem no blog).

#1. Como instalar o Meta Pixel com o Gerenciador de tags do Google: visualização de página

Antigamente (antes de 2019), a única maneira de instalar o Facebook Pixel por meio do Gerenciador de tags do Google era usando o modelo de tag HTML personalizado. Isso significava trabalhar diretamente com o código JavaScript, editá-lo um pouco, etc.

Hoje em dia, as coisas são muito mais simples e elegantes porque Simo Ahava  criou um modelo personalizado de pixel do Facebook e o compartilhou com todos. Isso tornará todo o processo de gerenciamento de tags Meta Pixel mais conveniente e menos sujeito a erros.

Mais tarde, o Facebook ( facebookarchive ) adquiriu esse modelo. No entanto, ainda é o mesmo modelo.

#1.1. Adicionar modelo personalizado de pixel do Facebook

Se você for em Tags > Novo (no Gerenciador de tags do Google) e pesquisar por “Facebook”, não encontrará nenhum modelo de tag. Isso ocorre porque, por padrão, essa tag não existe no contêiner do GTM. Em vez disso, você terá que adicionar as tags de evento manualmente.

Felizmente, existe um recurso muito conveniente chamado Community Template Gallery, onde qualquer pessoa em nosso setor (que saiba codificar) pode criar modelos personalizados de variáveis ​​ou tags.

No Gerenciador de tags do Google, acesse Modelos > Modelos de tags > Galeria de pesquisa e, no campo de pesquisa, digite  Facebook .

Você verá este modelo. Clique nele e adicione-o ao seu espaço de trabalho. Um novo modelo aparecerá na seção Tags > Novo > Personalizado . Você pode reutilizá-lo várias vezes para tags no mesmo contêiner.

#1.2. Tag de exibição de página de meta pixel

Tudo começa com a implementação básica do Meta pixel. Em outros guias (especialmente os mais antigos) encontrados online, você pode ver um termo chamado  Facebook Pixel Base Code (ou algo semelhante). Nas próximas etapas, explicarei exatamente isso (mas sem usar o termo  Base Code ).

No Gerenciador de tags do Google, vá para Tags > Novo > Pixel do Facebook.  Digite as configurações que você vê na captura de tela abaixo (se alguns campos estiverem vazios, não alterei nada lá):

No campo Facebook Pixel ID(s), insira o Pixel ID que você copiou em Como obter o Facebook Pixel ID? capítulo. Este campo permite que o Gerenciador de tags do Google saiba a conta exata do meta anúncio para enviar esses dados.

Por enquanto, deixe todas as outras configurações como estão.

Defina a tag para disparar em Todas as páginas .

#1.3. Variável constante para o ID do pixel

Alerta de spoiler : semelhante aos eventos personalizados do GA4 , precisaremos criar uma tag Meta Pixel separada para cada interação. O Meta Pixel ID deve estar presente em todas as tags.

Suponha que você implemente 50 ou mais tags que enviam dados para o Facebook. Você precisaria inserir o Pixel ID mais de 50 vezes manualmente. Mas e se um dia você tiver que mudar para outro Pixel ID? Você precisará alterar o ID em todas as tags manualmente.

Para tornar as coisas mais otimizadas, você pode criar uma variável GTM Constant que armazene seu Meta Pixel ID. Então você pode reutilizar a mesma variável sempre que precisar. Depois de alterar o Pixel ID, você precisará fazer isso apenas uma vez – na variável.

No Gerenciador de tags do Google, vá para  Variáveis ​​> Variáveis ​​definidas pelo usuário > Novo > Constante e cole seu Meta Pixel ID.

Salvei a variável aqui como Constant – Facebook Pixel ID . Em seguida, abra a tag de exibição de página do pixel do Facebook criada anteriormente e insira essa variável.

#1.4. Teste a tag de pixel do Facebook

Agora, é hora de garantir que você implementou tudo corretamente.

Modo de visualização e depuração do GTM. No Gerenciador de tags do Google, ative o modo de visualização e depuração.  A página onde você deseja instalar o Meta Pixel abrirá em uma nova aba.

Verifique a janela de depuração para o evento Container Loaded . Clique nele e você verá que sua tag do pixel do Facebook foi disparada.

Auxiliar de pixel do Facebook. Semelhante ao GA4, você deve garantir que o Meta Pixel tenha recebido os dados do evento. Meta tem uma extensão de navegador chamada Facebook Pixel helper . Instale-o e este ícone aparecerá no canto superior direito do seu Chrome.

Atualize a página E, se você implantou corretamente o pixel do Facebook, sua cor mudará para azul e você verá um número dentro desse ícone.

Clique nesse ícone e vamos verificar o que ele gravou. Vemos que um evento PageView foi acionado e há um ícone de marca de seleção verde próximo a ele. Isso é bom! Se houvesse um ícone de carregamento ou amarelo, isso significaria um possível problema. Mas o ícone verde indica que fizemos isso corretamente.

Relatórios de Meta Pixel

No Facebook Business Manager, vá para Events Manager > Data Sources > Select your Pixel e depois Test Events .

Insira a URL do seu site (se eu estivesse trabalhando com meu site, inseriria https://www.analyticsmania.com ) e clique em Abrir site . Depois de ser redirecionado para o seu site, vá para a  guia Eventos de teste  e verifique se você vê exibições de página provenientes do seu dispositivo. Se nada aparecer, volte ao seu site e atualize a página novamente.

Se estiver tudo bem, você implementou o Meta Pixel com o Google Tag Manager corretamente.

#2. Outras opções de como instalar o Meta Pixel com Google Tag Manager

Existem outras duas opções de como instalar o Pixel, mas vou citá-las bem resumidamente (pois ainda temos muito material para cobrir):

• Manualmente usando a tag HTML personalizada (semi-recomendado). Era um método recomendado antes do início de 2019 (quando o modelo personalizado não estava disponível).
• “Feito para você” . Eu não recomendo este.

#2.1. Instalação manual usando a tag HTML personalizada

Você pode implantar manualmente a tag HTML personalizada quando tiver acesso ao código Meta pixel completo. Dentro do código da tag, você precisaria fazer modificações se quisesse capturar parâmetros adicionais.

Você também precisaria usar o sequenciamento de tags para cada tag de evento para garantir que o código base do Facebook seja acionado toda vez que ocorrer um evento ou exibição de página.

Onde você pode obter o código completo do pixel do Facebook? Vá para o Meta Pixel escolhido no Gerenciador de Eventos e selecione seu pixel. Clique em Gerenciar Integrações  e uma nova janela aparecerá na sua tela.

Supondo que você já tenha criado o Pixel, deve haver uma opção como na captura de tela abaixo. A partir daí, clique em Adicionar a outro site.

Uma nova tela aparecerá, perguntando se você deseja instalá-lo manualmente ou por meio de uma integração de parceiro. Escolha Adicionar código de pixel manualmente ao site e o navegador redirecionará para uma nova página.

Copie o código principal de lá:

Acesse Tags > Novo > Tag HTML personalizada no Gerenciador de tags do Google e cole o código. O código <noscript> é inútil lá , então você está livre para removê-lo.

#2.2. “Feito para você”

Quando você tenta obter o código JavaScript do Pixel do Facebook completo, o Meta oferece várias opções para instalar o pixel. Um deles é o “Gerenciador de tags do Google”.

Eu altamente encorajo você a NÃO escolher esta opção. Essa opção de instalação integrada por meio do Gerenciador de tags do Google é um pouco complicada.

• Você precisará conceder acesso Meta ao seu contêiner do Gerenciador de tags do Google (ele pode adicionar, excluir tags e fazer todos os outros tipos de coisas. E não quero dar esse tipo de permissão).
• Quando você conceder acesso, o Meta adicionará automaticamente o código Pixel ao seu contêiner e publicará imediatamente seu contêiner (independentemente de você ter outras alterações (possivelmente não testadas).
• O nome dessa tag provavelmente não corresponderá à sua convenção de nomenclatura atual.

Portanto, para obter apenas uma tag criada em seu contêiner que seja acionada em todas as páginas, fornecer acesso Meta não é uma boa opção.

É por isso que você não deve escolher a opção “Gerenciador de tags do Google” (independentemente de quão contra-intuitivo isso pareça). Ao instalar o contêiner, você ainda usará o GTM e terá controle total sobre o que acontece em seu contêiner.

​

#3. Como rastrear eventos com o pixel do Facebook e o gerenciador de tags do Google

Até este ponto, conseguimos fazer uma implementação básica do Facebook Pixel por meio do Google Tag Manager. Mas as visualizações de página sozinhas não dizem muito sobre o que um visitante/usuário está fazendo em seu site.

Por exemplo, os visitantes acabaram de acessar uma página e sair? Ou clicaram em algo, rolaram, enviaram um formulário ou fizeram uma compra?

É aí que o rastreamento de eventos é importante. Somente fornecendo ao Meta dados adicionais e de qualidade, você pode esperar tirar o máximo proveito dele.

Quando se trata de rastreamento de eventos com o Facebook Pixel, existem dois tipos de eventos:

• Padrão
• Personalizado

#3.1 Eventos de pixel do Facebook padrão x personalizados

De acordo com a documentação oficial do Facebook , os eventos padrão são as ações mais comuns que um visitante/usuário pode realizar em um site. A plataforma Meta reconhece e oferece suporte a esses eventos em todos os produtos de anúncios. Esses eventos podem ser usados ​​para construir audiências e otimizar conversões.

Aqui estão os eventos padrão  que o pixel FB suporta:

• Visualização de página
• AddPaymentInfo
• Adicionar ao carrinho
• Adicionar a lista de desejos
• Registro completo
• Contato
• PersonalizarProduto
• Doar
• FindLocation
• InitiateCheckout
• Liderar
• Comprar
• Cronograma
• Procurar
• Iniciar teste
• Enviar candidatura
• Se inscrever
• ViewContent

Os títulos são praticamente auto-explicativos. Portanto, se você deseja rastrear uma interação mencionada na lista acima, use definitivamente o Evento Padrão.

Eventos personalizados são interações que não se enquadram nos eventos padrão. Por exemplo:

• Rolagem
• Tempo na página (por exemplo, quando você aciona um evento depois que um visitante passa 5 minutos em uma página)
• Visualizou um determinado elemento
• Clique no link de saída
• Reprodução de vídeo, etc.

Tudo depende da sua imaginação.

#3.2 Uma tag + um gatilho para um evento padrão

Digamos que você queira rastrear quando alguém insere seu e-mail em sua página de destino. Olhando para a lista de possíveis eventos padrão, este deve ser considerado um  Lead . Então, vamos criar uma tag que enviará o evento “Lead” para o Facebook.

No Gerenciador de tags do Google, vá para Tags > Novo > Pixel do Facebook e insira as seguintes configurações:

Como você pode ver, no campo Event Name, escolhemos  Lead . Por enquanto, mantenha todos os outros campos vazios. A próxima coisa para que a tag funcione corretamente é definir um gatilho.

Isso depende do tipo de interação que você deseja acompanhar. Os gatilhos são uma história diferente que exige que você aprenda muito.

Se estivermos interessados ​​em rastrear leads, devemos lidar com formulários. Embora eu não vá me aprofundar em como fazer isso, aqui está um guia muito extenso sobre como rastrear formulários com o Gerenciador de tags do Google .

Se você tiver dificuldade para rastrear as interações por conta própria, pode ser necessário pedir ajuda a um desenvolvedor. Eles enviarão dados para a camada de dados e você precisará usar o  gatilho de evento personalizado  para capturar esses dados.

Quanto ao lead, vamos imaginar que um visitante (depois de inserir o e-mail) seja redirecionado para uma página de “obrigado” www.example.com/thank-you . Poderíamos criar um gatilho de visualização de página que dispara se o URL da página contiver /obrigado.

Mas lembre-se de que o rastreamento de formulário é TÃO cheio de nuances e seu gatilho pode parecer muito diferente.

#3.3 Teste o evento de pixel padrão do Facebook

Depois de criar uma tag e um acionador, salve suas alterações. Em seguida, ative o modo de visualização e depuração do GTM e navegue até um formulário de contato para enviar detalhes fictícios do lead. No meu exemplo, assim que insiro os detalhes, sou redirecionado para uma página de “obrigado”.

Como meu gatilho é baseado em uma exibição de página, verifico o evento Container Loaded em minha janela de visualização e depuração.

… e, em seguida, verifique se minha tag do pixel do Facebook (relacionada a um lead) foi acionada. Se sim, já é um bom começo! Leia este guia se estiver com dificuldades para depurar as configurações do Gerenciador de tags do Google.

O próximo passo (assim como foi com a tag FB Pageview) é verificar o Facebook Pixel Helper. Depois que a tag de lead for acionada, clique no ícone do Pixel Helper e verifique se você vê um ícone verde ao lado de um  evento de lead .

A etapa final é testar os relatórios no Facebook Business Manager. Vá para Gerenciador de eventos > Fontes de dados.  Escolha seu Pixel e clique em  Testar eventos . Verifique se você vê o  evento Lead lá.

#3.4 Uma tag + um gatilho para um evento personalizado

Neste exemplo, digamos que queremos rastrear sempre que alguém pressiona o  botão Reproduzir em um player de vídeo do YouTube incorporado em nossa página inicial. Primeiro, vamos criar uma tag. Vá para Tags > Novo > Pixel do Facebook e insira as seguintes configurações.

Queremos que essa tag seja disparada somente quando alguém clicar no botão Reproduzir. Portanto, precisamos criar um gatilho de vídeo do Youtube para isso. Clique na  seção Triggering em sua tag do pixel do Facebook e selecione o  ícone Plus no canto superior direito.

Em seguida, clique em Trigger Configuration > Youtube video e insira as seguintes configurações (você pode adicionar mais se quiser, como Progress )):

Salve o gatilho e ele será adicionado automaticamente à sua tag Meta Pixel.

Agora, se você deseja adicionar alguns dados adicionais ao evento personalizado, pode fazer isso em Object Properties .

Navegue até essa seção e adicione os parâmetros personalizados necessários. Você notará que as variáveis ​​que usei estão integradas no Gerenciador de tags do Google. Você só precisa ativá-los em Variables > Built-in Variables > Configure:

#3.5 Teste o evento personalizado

O princípio de teste é o mesmo descrito em #2.3. capítulo desta postagem do blog (relacionado ao teste dos eventos padrão). Seu objetivo aqui é garantir que:

• A tag Meta Pixel dispara
• O auxiliar do Pixel do Facebook mostra o ícone verde ao lado desse evento
• A seção Eventos de teste no Gerenciador de eventos do Facebook mostra o evento que você acabou de enviar

​

#4. Envie parâmetros adicionais para Meta Pixel com Google Tag Manager

Com o Facebook Pixel, você pode enviar não apenas eventos, mas também valores adicionais (por exemplo, total do pedido, título do vídeo etc.). Já fizemos isso no exemplo anterior do evento de vídeo personalizado.

Você pode encontrar uma lista completa de parâmetros padrão suportados aqui . A maioria deles é opcional. Se você estiver trabalhando com um evento personalizado, sinta-se à vontade para criar qualquer parâmetro personalizado que desejar.

De todos os eventos padrão, apenas o evento de compra requer  moeda  e  valor.

Além disso, olhando a documentação, você pode ver quais campos são esperados pelo Meta. Por exemplo, se você enviar o evento AddToCart e quiser enviar alguns dados personalizados (como preço do produto, etc.), o pixel do Facebook esperará  content_ids, content_name, content_type, contents, currency, value . Nenhum deles é necessário quando se trata de AddToCart .

Portanto, quando for passar algum parâmetro, consulte esta página e verifique a tabela de eventos padrão + seus parâmetros.

Vamos, por exemplo, rastrear uma Compra e ver como uma tag GTM deve ser configurada.

#4.1. Exemplo – Rastreamento de Compra com Parâmetros Adicionais

Imagine que os visitantes são redirecionados para uma página de “obrigado” após fazer uma compra. Pedi a um desenvolvedor para enviar  os dados da transação para a camada de dados nessa página

Aqui está o trecho de código que um desenvolvedor ativou (que contém as informações da transação).

<script>
window.dataLayer = window.dataLayer || [];
dataLayer.push({
 'evento': 'transação',
 'currencyCode': 'EUR',
 'transaçãoId': '1234',
 'transactionAffiliation': 'Acme Clothing',
 'transaçãoTotal': 38,26,
 'transactionTax': 1,29,
 'TransactionShipping': 5,
 'transactionProducts': [{
   'sku': 'DD44',
   'nome': 'Camiseta',
   'categoria': 'Vestuário',
   'preço': 11,99,  
   'Quantidade: 1
 }]
});
</script>

Tenha em mente que este código contém valores fictícios. Um desenvolvedor deve escrever algumas funções e lógica personalizada em seu código que substitua valores fictícios por dados de compra reais.

Olhando para a documentação oficial do Meta Pixel, dois campos são obrigatórios:

• Receita
• Moeda

Vamos enviá-los. A partir desse trecho de código da camada de dados, há duas chaves nas quais estamos interessados: currencyCode e  transactionTotal . Poderíamos reutilizá-los e enviar seus valores para o Facebook Pixel. Para isso, primeiro vamos criar duas Variáveis ​​de Camada de Dados  com as seguintes configurações:

Importante : esses valores diferenciam maiúsculas de minúsculas. Portanto, insira  o currencyCode , não o  currencycode .

Em seguida, crie um Meta Pixel Tag com a seguinte configuração:

Para registrar os valores necessários para o evento Compra:

• Navegue até as propriedades do objeto
• Lá, insira as variáveis ​​da camada de dados criadas.
• Verifique se os nomes correspondem ao formato fornecido pelo Facebook.

Enviaremos “EUR” como  moeda (porque “EUR” é o valor do  currencyCode  na camada de dados) e  38,26 porque esse é o valor do  transactionTotal na camada de dados).

Em seguida, clique na  seção Triggering em sua tag de pixel do Facebook e selecione o ícone  Plus  no canto superior direito para criar um novo trigger. Em seguida, clique em  Configuração do acionador > Personalizado . Queremos que o dataLayer.push (que contém os dados da transação) seja usado como um gatilho.

Em Custom Event Trigger , insira o nome do evento de transação (porque esse é o valor da chave ‘event’ nesse dataLayer.push).

Salve o acionador e, em seguida, salve a tag.

#4.2. Teste o evento com parâmetros adicionais

Agora, é hora de testar a configuração. Atualize  o modo de visualização e depuração , acesse seu site e conclua a compra. Até agora, você já deve saber o que fazer:

• Verifique se a tag do pixel do Facebook foi disparada na compra (no meu caso, devo clicar no  evento de transação no console de depuração e verificar se a tag foi realmente disparada).
  
• Verifique se o evento Purchase possui um ícone verde próximo a ele. Além disso, expanda o evento para ver se todos os parâmetros foram enviados conforme o esperado.
  
• Verifique se a seção Eventos de teste registrou o evento com parâmetros personalizados. Verifique o Capítulo #3.3.  aprender mais.

#5. O que você pode fazer com esses dados que você enviou para o Facebook?

Esta questão vai além do escopo desta postagem no blog. Assim, mencionarei rapidamente as possibilidades:

• Ao enviar eventos para o Facebook Pixel, você pode criar Conversões Personalizadas
• Você também pode criar públicos de remarketing
• Otimizar para conversões

​

#6. Outras coisas a saber sobre o pixel do Facebook com o Gerenciador de tags do Google

Os primeiros cinco capítulos desta postagem do blog mencionaram as principais coisas que você deve saber para implementar o pixel FB via GTM.

No entanto, isso não é o fim da lista. Abaixo, você encontrará outras coisas que podem ser úteis. No entanto, em vez de explicá-los em detalhes, darei uma breve olhada ou fornecerei links para você investigá-los individualmente.

#6.1. Detecção automática de dados

Seguindo as etapas deste guia, você provavelmente já percebeu que o Facebook Pixel Helper mostra coisas como  Microdata Automatically Detected ou  Button Click Automatically Detected. Isso é chamado  de Detecção Automática de Dados .

Meta Pixel tenta capturar vários dados adicionais em sua página. No entanto, não confio em soluções de rastreamento automático porque elas podem acabar capturando muitos dados inúteis também.

É por isso que geralmente desativo esse recurso. Se você quiser fazer o mesmo, vá para as tags de pixel do Facebook > Mais configurações e marque a  caixa de seleção Desativar configuração automática .

Faça isso em todas as tags de pixel do Facebook.

#6.2. Enviando dados para vários pixels do Facebook na mesma página

Pode haver casos em que você precise enviar os dados para vários pixels do Facebook , por exemplo, um pixel é apenas para o departamento e outro para toda a empresa. Isso não é um problema para o Facebook Pixel, e é bastante fácil de fazer com um modelo de tag Custom Facebook Pixel.

Se você deseja definir a tag para enviar dados para vários pixels, insira-os no campo Facebook Pixel ID(s), separados por vírgula. Ou você pode inserir vários IDs na variável constante.

Ou você pode separar várias variáveis ​​constantes (cada uma contém um único FB Pixel ID).

Todas essas opções funcionarão.

#6.3. Correspondência avançada

O Facebook Pixel Advanced Matching permite que os anunciantes conectem seus dados de clientes – como endereços de e-mail, números de telefone e outros dados demográficos – a suas campanhas no Facebook, portanto, segmentem com mais precisão.

Em outras palavras, junto com os eventos, você também pode enviar o endereço de e-mail do usuário do Facebook, número de telefone, sexo, cidade, etc.

Importante: Todas essas informações são consideradas Informações Pessoais Identificáveis ​​(PII), e você precisa obter o consentimento de seus usuários/visitantes antes de enviar esses dados (mencionarei mais informações posteriormente).

Quando você envia informações pessoais como parâmetros de correspondência avançada, o Facebook Pixel faz o hash automaticamente desses dados usando o algoritmo de hash SHA-256.

Primeiro, mostrarei como configurar a correspondência avançada no Gerenciador de tags do Google. Imagine que você trabalha com um site onde os usuários podem fazer login e usar seus serviços. Você pode pedir a um desenvolvedor para enviar os seguintes dados para a camada de dados (e fazer isso antes que o código do contêiner GTM seja carregado):

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  'evento': 'userData',
  'userId': '123abc',
  'email': ' johndoe@example.com ',
  'cidade': 'nova york',
  'gênero': 'm',
  'país': 'nós'
});

Lembre-se de que o código acima é apenas um código fictício/exemplo. O código do seu desenvolvedor deve substituir esses valores de espaço reservado por alguns dados reais do usuário.

#6.3.1. Criar variáveis ​​de camada de dados

Para cada ponto de dados que você deseja acessar, você precisará criar uma variável de camada de dados separada , por exemplo:

Faça o mesmo para o restante dos pontos de dados.

#6.3.2. Defina os parâmetros no FB Pixel Tag

Agora, vá para Tags e abra sua tag Meta Pixel Pageview. Marque a  caixa de seleção Ativar correspondência avançada  e uma nova  seção de parâmetros de dados de informações personalizadas será exibida.

Expanda essa seção e insira as seguintes configurações. Primeiro, como tenho o e-mail, a cidade, o gênero e o país, criarei uma linha separada para cada um deles, escolherei o  nome do parâmetro adequado e inserirei minhas variáveis ​​​​da camada de dados na  coluna Valor do parâmetro  .

Você pode fazer o mesmo para todas as suas tags de pixel do Facebook. No entanto, é totalmente suficiente fazer isso para a tag PageView (porque geralmente ela dispara o primeiro no carregamento da página).

#6.3.3. Teste a configuração

Verifique o Pixel Helper do Facebook. Você deve ver os parâmetros de correspondência avançada que foram enviados:

Além disso, você deve usar os Parâmetros de correspondência avançados na  seção Eventos de teste  .

#7. Obtenha o consentimento antes do rastreamento (#GDPR ou qualquer outro regulamento de privacidade relacionado)

Por último, mas não menos importante, a privacidade do usuário. Todas essas coisas que você pode configurar no Facebook Pixel com o Google Tag Manager são legais. No entanto, você não pode fazer isso a menos que obtenha o consentimento de seus visitantes/usuários.

Vários regulamentos protegem a privacidade dos usuários e exigem que as empresas obtenham o consentimento dos usuários/visitantes antes de enviar dados para o Facebook Pixel e outras plataformas de terceiros. Esses regulamentos também são continuamente atualizados para permanecerem relevantes aos tempos.

Não sou advogado, então, por favor, não me peça aconselhamento jurídico. Faça isso com seu departamento jurídico.

Com o Gerenciador de tags do Google, você pode controlar como suas tags são disparadas, dependendo se um visitante/usuário deu consentimento para fins de marketing.

Se você quiser aprender como implementar um mecanismo de consentimento de cookies em seu site por meio do Gerenciador de tags do Google, primeiro leia este guia . Ou inscreva-se neste curso para obter instruções mais atualizadas.

Depois de implementar o mecanismo de consentimento, você terá vários gatilhos de bloqueio e variáveis ​​relacionadas ao consentimento.

Normalmente, você usaria os gatilhos de bloqueio (o que eu aconselhava as pessoas a fazer no passado). Agora, o FB pixel oferece um recurso interessante que torna o gerenciamento um pouco diferente. Claro, você ainda pode seguir as diretrizes gerais do meu guia e usar os gatilhos de bloqueio. Mas a solução mais recente (desenvolvida pelo Facebook) é mais poderosa.

Porque? Porque com a solução mais recente, continuaremos disparando tags mesmo que o consentimento não tenha sido dado. No entanto, os dados não serão enviados. Ele será adicionado a uma fila. E assim que o visitante der consentimento, todos os eventos da fila serão enviados para o Facebook.

Por exemplo:

• Um visitante chega à sua página
• Rola para baixo (a tag FB é acionada e o evento é adicionado a uma fila)
• Permanece em uma página por 1 minuto (outra tag disparada e o evento é adicionado a uma fila)
• Um visitante dá consentimento clicando em um botão em um pop-up (ou em uma barra)
• Os eventos são mantidos em fila, aguardando o consentimento do usuário. Assim que um visitante concordar em ser rastreado, o Meta começará a receber os dados do evento.

Importante: se a página for recarregada/atualizada, um usuário navegará para outra página (antes de dar consentimento) e a fila será limpa.

#7.1. Consentimento concedido

Você verá um menu suspenso chamado Consent Granted na tag Meta Pixel . Por padrão, seu valor é definido como true (o que significa que quando a tag é disparada, os dados são enviados para o Facebook).

No entanto, se você implementar a solução de consentimento de cookies que descrevi aqui  ou algo semelhante, você terá variáveis ​​como “Consentimento dado ao marketing”, “Consentimento dado às estatísticas”, etc.

Essas variáveis ​​devem retornar  true ou  false dependendo se o usuário/visitante consentiu em ser rastreado.

Quando se trata do Facebook Pixel, precisaremos usar uma variável relacionada ao consentimento do Marketing. No meu caso, isso é Regex – cookies de segmentação permitidos  (você também pode obtê-lo se implementar esta solução ):

Essa variável usa outra variável chamada  cjs – false . É uma variável JavaScript personalizada que contém o seguinte código:

função() {
  retorna falso
}

Use essa variável de tabela regex no campo  Consentimento concedido (GDPR) . Importante : Este campo aceita  verdadeiro ou  falso . Portanto, se sua variável retornar valores diferentes, como  sim  ou não,  talvez seja necessário usar regex, pesquisa ou outra variável que transforme a saída.

#7.2. Uma tag que é disparada quando o consentimento é dado

Para enviar todos os eventos em espera na fila, devemos enviar qualquer evento que contenha o  Consent Granted: true . Para isso, costumo usar o evento Custom chamado  consentGiven  (você pode nomeá-lo como quiser).

Esta é a configuração dessa tag:

O gatilho depende do tipo de solução de consentimento de cookie que você implementou. Por exemplo, algumas configurações usam o acionador Custom Event  consent_marketing , enquanto outras podem usar um diferente.

Portanto, certifique-se de disparar a tag de evento personalizada mencionada acima apenas quando o consentimento para fins de marketing for dado.

Se você implementou esta solução , seu gatilho pode ter esta aparência:

Desculpe por não ser muito específico aqui. No entanto, o aspecto “depende” é muito forte.

#8. Meta Pixel + Gerenciador de tags do Google do lado do servidor

Se você deseja tornar sua configuração de Meta Pixel mais precisa e coletar dados de maior qualidade, considere implementar uma solução do lado do servidor também.

De acordo com a Meta , o rastreamento do lado do servidor com a API de conversão da Meta pode ajudá-lo a:

• Reduza o custo por ação como resultado da conectividade aprimorada
• Melhorar a medição
• Reduza o custo por ação
• Aumente o controle de dados

Meta Pixel com Google Tag Manager: palavras finais

Ufa! Fazia tempo que não escrevia um post tão longo no blog. Embora a postagem média seja de aproximadamente 3.000 palavras, esta tem mais de 7.000. E, honestamente, há ainda mais coisas para cobrir. No entanto, acho que os que compartilhei acima são essenciais e se aplicam à maioria das configurações.

Portanto, quando se trata da implementação do Meta Pixel com o Gerenciador de tags do Google, aqui estão as principais conclusões:

• Use o modelo de tag de pixel personalizado do Facebook para facilitar o gerenciamento
• Não se limite apenas às exibições de página, acompanhe também os eventos
• No entanto, se os eventos personalizados ainda estiverem disponíveis para criar públicos e conversões
• É bastante fácil enviar os dados para vários pixels do Facebook de uma só vez
• Considere o uso de correspondência avançada e propriedades do usuário
• Obtenha consentimento antes de enviar dados sobre seus visitantes/usuários para o Facebook
• Sempre teste minuciosamente. Verifique o modo de visualização, o auxiliar do pixel do Facebook, a seção de eventos de  teste do FB Events Manager .