Como Instalar o Pixel do Meta Ads no Seu Site
Guia prático para instalar o Pixel do Meta Ads em qualquer site usando código manual, Google Tag Manager ou plataformas como Shopify e Hotmart
Você já criou o Pixel do Meta Ads. Agora vem a parte que realmente importa: instalar no site. Sem a instalação correta, o Pixel não rastreia nada -- e suas campanhas continuam sem dados de conversão.
Existem três formas principais de instalar o Pixel: código manual, Google Tag Manager e integrações nativas de plataformas. Cada método tem vantagens e desvantagens dependendo do seu contexto. Neste guia, vamos cobrir todos eles com passo a passo completo.
Método 1: Instalação manual (código no head)
Esse é o método mais direto. Você pega o código do Pixel e insere manualmente no <head> de todas as páginas do site.
Quando usar
- Sites com código próprio (HTML puro, Next.js, React, etc.)
- Quando você tem acesso ao código-fonte
- Para quem quer controle total sobre o que é instalado
Passo a passo
- Acesse o Gerenciador de Eventos (Events Manager)
- Selecione o Pixel que você criou
- Clique em Configurações (Settings)
- Na seção "Instalação", clique em Instalar código manualmente
- Copie o código base do Pixel
O código tem esse formato:
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', 'SEU_PIXEL_ID');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=SEU_PIXEL_ID&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->
- Cole esse código dentro da tag
<head>do seu site, antes do fechamento</head> - Substitua
SEU_PIXEL_IDpelo ID real do seu Pixel - O código deve estar presente em todas as páginas
Dica para sites com template
Se o seu site usa um template ou layout base (como _document.js no Next.js, base.html no Django ou header.php no WordPress), insira o código nesse arquivo. Assim, ele carrega automaticamente em todas as páginas.
Método 2: Google Tag Manager (GTM)
O Google Tag Manager é um gerenciador de tags que permite instalar o Pixel (e outros scripts) sem mexer diretamente no código do site.
Quando usar
- Você já usa o GTM no site
- Precisa gerenciar vários scripts de rastreamento
- Quer facilidade para adicionar e remover tags sem alterar código
- Trabalha com equipe e quer controle centralizado
Passo a passo
- Acesse o Google Tag Manager
- Selecione o container do seu site
- Clique em Tags → Nova
- Nomeie a tag como "Meta Pixel - Base"
- Em Configuração da tag, selecione HTML personalizado
- Cole o código base do Pixel (o mesmo do Método 1)
- Em Acionamento (Trigger), selecione All Pages (Todas as páginas)
- Clique em Salvar
- Clique em Enviar (Submit) para publicar a alteração
Eventos via GTM
Para disparar eventos além do PageView, crie tags adicionais:
- Crie uma nova tag HTML personalizada
- Insira o código do evento, por exemplo:
<script>
fbq('track', 'Purchase', {value: 149.90, currency: 'BRL'});
</script>
- Configure o acionamento para a página ou ação específica (ex: página de obrigado, clique em botão)
- Publique a alteração
Importante: não inclua o código base (fbq('init', ...)) nas tags de evento. O init só deve existir uma vez, na tag base.
Template oficial do Meta para GTM
A Meta disponibiliza um template oficial no GTM Gallery:
- Na tela de nova tag, clique em Descubra mais tipos de tag na galeria da comunidade
- Busque por "Facebook Pixel"
- Instale o template oficial da Meta
- Configure com o seu Pixel ID
- Esse template facilita a configuração de eventos sem código
Método 3: Integrações nativas de plataformas
Se você usa uma plataforma de e-commerce ou infoprodutos, a instalação pode ser feita apenas colando o Pixel ID nas configurações. Sem código, sem GTM.
Tabela de instalação por plataforma
| Plataforma | Caminho para instalar | Tipo de integração |
|---|---|---|
| Shopify | Apps → Facebook & Instagram → Conectar → Pixel ID | Nativa (plugin oficial) |
| WooCommerce | Plugin "Facebook for WooCommerce" ou "PixelYourSite" | Plugin |
| Hotmart | Configurações do Produto → Pixel de rastreamento → Facebook → ID | Nativa |
| Kiwify | Configurações → Integrações → Facebook Pixel → ID | Nativa |
| Nuvemshop | Configurações → Códigos externos → Facebook Pixel | Nativa |
| Wix | Marketing → Integrações de marketing → Facebook Pixel → ID | Nativa |
Vantagens da integração nativa
- Simplicidade: basta colar o Pixel ID
- Eventos automáticos: plataformas como Shopify e WooCommerce disparam eventos de e-commerce (AddToCart, Purchase) automaticamente
- Menos erros: sem risco de colar código errado
Desvantagens
- Menos controle: você depende da plataforma para configurar parâmetros
- Eventos limitados: nem sempre todos os eventos padrão são disparados
- Personalização restrita: difícil adicionar eventos customizados
Como verificar se a instalação está correta
Depois de instalar, você precisa confirmar que o Pixel está funcionando.
1. Meta Pixel Helper (extensão do Chrome)
Instale a extensão Meta Pixel Helper no Chrome. Ao visitar seu site:
- Ícone verde: Pixel detectado e funcionando
- Ícone amarelo: Pixel detectado, mas com avisos
- Ícone cinza: Pixel não detectado
A extensão mostra quais eventos foram disparados e quais parâmetros foram enviados.
2. Testar Eventos no Gerenciador de Eventos
- Vá ao Gerenciador de Eventos
- Selecione seu Pixel
- Clique em Testar eventos
- Insira a URL do site
- Navegue pelo site em outra aba
- Os eventos devem aparecer em tempo real
3. Verificar o Diagnóstico
Na aba Diagnóstico do Gerenciador de Eventos, a Meta lista problemas detectados:
- Pixel duplicado
- Eventos sem parâmetros obrigatórios
- Falhas de carregamento
- Erros de configuração
Erros comuns na instalação
Pixel instalado em duplicidade
Se você instalou pelo código manual e por um plugin, o Pixel vai disparar duas vezes. Isso infla as métricas e confunde o algoritmo. Escolha um único método de instalação.
Código fora da tag head
O código base deve estar dentro do <head>. Se estiver no <body> ou no rodapé, pode carregar tarde demais e perder eventos.
Pixel ID incorreto
Parece óbvio, mas acontece. Confira se o ID no código corresponde ao Pixel correto no Gerenciador de Eventos. Um dígito errado e o Pixel não vai funcionar.
Bloqueadores de anúncios
Extensões como uBlock Origin e AdBlock bloqueiam o Pixel no navegador do usuário. Isso é normal e não indica erro na instalação. Para contornar, considere implementar a API de Conversões (server-side) como complemento.
Cache do site
Após instalar o código, limpe o cache do site e do navegador. Plugins de cache (como WP Super Cache ou Cloudflare) podem servir a versão antiga da página sem o Pixel.
Qual método escolher
| Critério | Código manual | Google Tag Manager | Integração nativa |
|---|---|---|---|
| Dificuldade | Média | Média-alta | Baixa |
| Controle | Total | Total | Limitado |
| Eventos automáticos | Não | Não | Sim (em algumas) |
| Ideal para | Devs, sites custom | Agências, multi-tags | Lojistas, infoprodutores |
| Risco de erro | Médio | Baixo | Baixo |
Para a maioria dos casos, a recomendação é:
- Plataforma com integração nativa (Shopify, Hotmart, Kiwify): use a integração nativa
- Site próprio ou WordPress: use o Google Tag Manager ou plugin dedicado
- Landing page simples: código manual no head
Com o Pixel instalado e verificado, suas campanhas passam a receber dados de conversão, e o algoritmo da Meta começa a otimizar as entregas. A partir daí, acompanhar os resultados fica essencial. O Trafius facilita esse acompanhamento permitindo consultar CPA, ROAS e volume de conversões diretamente pelo WhatsApp, sem precisar abrir o Gerenciador toda vez.