Como adicionar um banner de cookies ao seu site
Um guia passo a passo para adicionar um banner de cookies com uma única tag de script, GTM, WordPress ou Shopify, e testar se ele bloqueia rastreadores.
O que um banner de cookies realmente faz
Um banner de cookies é o pequeno aviso que aparece quando alguém entra no seu site pela primeira vez, perguntando se a pessoa concorda com cookies e rastreadores não essenciais. Sob leis como o GDPR, as regras do UK PECR e a DPDPA da Índia, o banner é apenas a ponta visível do sistema. O trabalho de verdade acontece por baixo: scripts não essenciais, como analytics, pixels de publicidade e widgets de chat, não podem ser executados até o visitante dar consentimento.
Essa distinção importa porque um banner que apenas exibe uma mensagem, mas deixa o Google Analytics ou o pixel da Meta dispararem no carregamento da página, não está em conformidade. Os reguladores foram claros de que o consentimento precisa ser obtido antes de o rastreador carregar, não depois. Então o objetivo de adicionar um banner é duplo: mostrar uma escolha clara e bloquear os rastreadores até que essa escolha seja feita.
Opção 1: uma única tag de script (qualquer site)
A forma mais rápida de adicionar um banner é colocar um script no <head> do seu HTML. Depois de criar um site no seu painel do ConsentX, você recebe um snippet de incorporação que se parece com uma única linha referenciando o embed.js com a chave do seu site. Cole-o o mais alto possível no <head> para que ele carregue antes dos seus outros scripts.
Coloque-o acima das suas tags de analytics e de publicidade. A ordem importa porque o ConsentX precisa ser registrado primeiro para conseguir segurar os rastreadores abaixo dele até o visitante decidir. Se você marcar seus rastreadores corretamente no painel, o carregador vai mantê-los bloqueados na primeira visita e liberá-los no momento em que o consentimento for concedido.
Essa abordagem funciona em qualquer site feito à mão, gerador de sites estáticos ou framework em que você controla o <head> do HTML. Também é o método mais limpo, porque não há uma camada de plugin no meio.
Opção 2: Google Tag Manager
Se seus rastreadores já são gerenciados no Google Tag Manager, você também pode adicionar o ConsentX pelo GTM. Crie uma nova tag de HTML personalizado, cole o snippet de incorporação nela e configure-a para disparar no acionador de Inicialização de consentimento, para que ela seja executada antes de todo o resto.
O padrão mais limpo é combinar o banner com o Google Consent Mode. Em vez de deixar as tags do GTM dispararem livremente, você as condiciona ao estado de consentimento, e o ConsentX atualiza esse estado quando o visitante escolhe. Assim o próprio GTM segura as tags até o consentimento ser concedido, que é exatamente o comportamento que os reguladores esperam.
Evite o erro comum de carregar o ConsentX pelo GTM enquanto sua tag de analytics continua disparando em Todas as páginas sem nenhuma verificação de consentimento. Se o rastreador não estiver condicionado, o banner é decorativo e você continua exposto.
Opção 3: WordPress
No WordPress você não precisa de um plugin pesado. O caminho mais simples é adicionar o snippet de incorporação ao cabeçalho do seu tema por meio de um plugin de código de cabeçalho e rodapé ou do campo de código personalizado do <head> do seu tema, para que ele carregue no <head> em todo o site.
Se você usa um plugin de SEO ou de cache, coloque o snippet onde ele não seja removido nem adiado, porque adiar o carregador de consentimento pode deixar rastreadores passarem antes de ele inicializar. Depois de adicioná-lo, limpe qualquer cache de página para que os visitantes recebam a nova marcação do <head>.
Sites em WordPress costumam carregar rastreadores por vários plugins ao mesmo tempo, então use a descoberta de rastreadores do painel para encontrar cada script e marcá-lo antes de confiar no banner.
Opção 4: Shopify
No Shopify, adicione o snippet de incorporação ao seu tema editando o theme.liquid e colando-o dentro do elemento <head>, perto do topo. Os temas do Shopify carregam vários scripts próprios e de apps, então posicionar o carregador no alto do <head> é importante.
O Shopify também tem sua própria API de privacidade e consentimento do cliente para a loja. Sempre que possível, conecte o ConsentX a esse sinal para que os pixels nativos do Shopify respeitem a escolha do visitante junto com os seus outros rastreadores. Teste com um fluxo de checkout, porque as páginas de checkout às vezes carregam scripts que as páginas da sua loja não carregam.
Como testar se o banner realmente bloqueia rastreadores
O teste é a etapa que a maioria das equipes pula, e é a que decide se você está de fato em conformidade. Abra seu site em uma janela anônima nova, depois abra as ferramentas de desenvolvedor do navegador e observe a aba Rede enquanto a página carrega. Antes de clicar em qualquer coisa no banner, você não deve ver nenhuma requisição para domínios de analytics ou de publicidade.
Em seguida, clique em Recusar e recarregue. Os rastreadores devem continuar ausentes e nenhum cookie de marketing deve aparecer na aba Aplicativo ou Armazenamento. Depois clique em Aceitar e confirme que os rastreadores agora carregam e que os cookies aparecem. Se os rastreadores dispararem antes de você escolher, ou o script está posicionado baixo demais no <head>, ou o rastreador não está marcado para bloqueio.
Repita o teste em alguns tipos de página importantes, incluindo sua página inicial, uma página de produto ou de conteúdo e qualquer página com widget de chat ou vídeo incorporado, já que essas costumam trazer scripts de terceiros extras.
Este guia é um resumo em linguagem simples para informação geral e não constitui aconselhamento jurídico. Confirme suas obrigações com um advogado qualificado.
Relacionado no ConsentX
Coloque este guia em prática
Comece grátis, escaneie seu site ou fale com nosso time.