Skip to main content

Configuração do Rastreamento

Este guia irá ajudá-lo a configurar corretamente o rastreamento da Metrito em seu site.

Criando seu Primeiro Domínio​

  1. Acesse a página "Trackeamento" na plataforma Metrito
  2. Clique em "Adicionar Domínio"
  3. Insira o domínio exatamente como é acessado pelos seus clientes

Exemplos de Domínios Corretos​

Sua Landing PageDomínio Correto
https://meuprodutolegal.commeuprodutolegal.com
https://www.nomededominio.com.brwww.nomededominio.com.br
https://lp.criativocampeao.netlp.criativocampeao.net
Importante

Não inclua 'https://' ou caminhos/slugs após o domínio. Apenas o domínio base é necessário.

Domínios não Suportados

Domínios que não são de sua propriedade (como subpáginas da XQuiz, Inlead, ou checkouts como CartPanda e Hotmart) não são suportados, pois a verificação de DNS requer acesso ao domínio principal.

Subdomínio de Rastreamento​

O que é?​

O subdomínio de rastreamento permite que o script da Metrito seja servido a partir de um subdomínio do seu próprio domínio, evitando bloqueios de requisições de terceiros e ad-blockers.

Como Configurar​

  1. Ative a opção "Subdomínio de Rastreamento"
  2. Adicione o registro CNAME fornecido no seu provedor de DNS
  3. Aguarde a verificação do DNS (pode levar até 24 horas)
Recomendação

Recomendamos fortemente o uso do subdomínio de rastreamento se você tiver acesso ao seu DNS.

Instalação do Pixel Metrito​

Adicionando o Script​

O script deve ser adicionado na seção <head> do seu site.

Não Use GTM

Embora o Google Tag Manager (GTM) funcione, não recomendamos seu uso pois pode ser bloqueado em alguns casos, especialmente no iOS.

Verificando a Instalação​

  1. Acesse seu site em uma guia anônima
  2. Clique com botão direito -> Inspecionar
  3. Abra o Console
  4. Procure pela mensagem:
Ⓜ️ Metrito: Setup started for domain - seudominioaqui.com

Conectando Pixels do Meta Ads​

  1. Na seção 'Conectar Pixels':
    • Clique em 'Cadastrar novo Pixel'
    • Insira o ID do Pixel (disponível no Gerenciador de Eventos da Meta)
    • Gere e insira um novo token de API
    • Salve as alterações
note

O PageView é disparado automaticamente pelo nosso script.

Integrando Checkouts​

  1. Acesse a página "Integrações"
  2. Clique em 'Adicionar Integração'
  3. Selecione seu checkout na seção 'Vendas'
  4. Configure:
    • Nome da integração
    • Copie a URL do webhook gerada
    • Configure o webhook no seu checkout
Não Esqueça!

Volte à página de 'Trackeamento' e ATIVE o checkout adicionado para começar a receber os eventos de venda.

Configuração de UTM para Meta Ads​

Importância do Uso Correto de UTMs​

Para que o rastreamento da Metrito funcione corretamente com o Meta Ads, é essencial configurar os parâmetros UTM seguindo nosso modelo padrão no gerenciador de anúncios.

Como Configurar no Meta Ads​

  1. Acesse o Gerenciador de Anúncios do Meta
  2. Durante a criação ou edição de um anúncio, na seção de URL:
    • Na seção de parâmetros UTM, selecione o modelo recomendado pela Metrito
    • Verifique se todos os campos estão presentes.

Configuração de UTM no Meta Ads

Importante

Lembre-se de SEMPRE adicionar o template de UTMs copiado na sua configuração do anúncio do Meta Ads para o funcionamento correto da plataforma.

Utilizando UTMs com Cloakers​

Se você utiliza um cloaker em suas campanhas, não há problema. Basta adicionar nosso template de UTMs e em seguida usar o caractere '&' (E comercial) para indicar novos parâmetros do cloaker.

Exemplo:​

utm_source=facebook&utm_medium=cpc&utm_campaign=id_da_campanha&cloaker_param1=valor1&cloaker_param2=valor2
Atenção

Evite utilizar como parâmetros do cloaker os mesmos nomes já utilizados pela Metrito:

  • utm_source
  • utm_medium
  • utm_campaign
  • utm_content
  • utm_term

Também evite parâmetros da UTMify, caso esteja utilizando ambas as ferramentas.

Pontos Importantes​

⚠️ Evite Duplicação de Eventos​

  • NUNCA deixe o envio do evento de Purchase habilitado no seu gateway/checkout
  • NUNCA utilize mais de uma ferramenta para enviar eventos de Purchase para o Meta Ads

Eventos Automáticos​

  • PageView: Disparado automaticamente ao carregar a página
  • Purchase: Disparado automaticamente ao receber webhooks de compra aprovada

Eventos Personalizados​

O que são Eventos Personalizados?​

Eventos personalizados permitem rastrear interações específicas dos usuários em seu site além dos eventos automáticos. Eles são fundamentais para otimizar campanhas de Meta Ads e entender melhor o comportamento do usuário.

Benefícios​

  • Mensurar interações específicas além do PageView e Purchase
  • Acompanhar comportamentos-chave na jornada do usuário
  • Otimizar campanhas com sinais personalizados
  • Criar públicos mais segmentados para remarketing

Tipos de Gatilhos Disponíveis​

Na criação de um evento personalizado, você pode escolher entre diversos tipos de gatilhos:

  1. Visualização de Página
    Dispara quando a página é carregada e visualizada pelo usuário.

  2. Duração da Visualização
    Dispara após o usuário permanecer um tempo específico na página.

  3. Duração da Visualização de Vídeo
    Dispara após o usuário assistir a um vídeo por um tempo determinado.

  4. Envio de Formulário
    Dispara quando um formulário específico é submetido (ex.: inscrição, contato).

  5. Clique em Elemento
    Dispara quando o usuário clica em um botão, link ou elemento específico.

  6. Visualização de Elemento
    Dispara quando um elemento específico (seção, imagem, texto) entra na área visível.

  7. Hover em Elemento
    Dispara quando o mouse passa sobre um elemento específico.

  8. Profundidade de Rolagem
    Dispara quando o usuário atinge determinada porcentagem da página durante o scroll.

Como Configurar um Evento Personalizado​

  1. Na plataforma Metrito, acesse a aba Eventos → Adicionar Evento Personalizado

  2. Configure as páginas onde o evento será ativo:

    • Todas as Páginas: o evento será monitorado em todo o site
    • Páginas Específicas: defina URLs ou padrões específicos

  3. Configuração de Gatilho:

    • Selecione o tipo de gatilho (ex.: Clique em Elemento, Visualização de Elemento)
    • Para gatilhos que dependem de elementos específicos, você precisará configurar o seletor:
      • Classe: use nome-da-classe para selecionar múltiplos elementos com a mesma classe
      • ID: use meu-id para selecionar um elemento único na página

  4. Configuração do Evento para Meta Ads:

    • Tipo de Evento:
      • Padrão: (ViewContent, AddToCart, InitiateCheckout, etc.)
      • Personalizado: crie um nome próprio seguindo as regras de nomenclatura
    • Nome do Evento Personalizado: apenas se escolher o tipo personalizado

  5. Finalize clicando em "Salvar Evento Personalizado"

Seleção de Elementos HTML​

Para gatilhos baseados em elementos HTML:

  • Usando Classes (classe):

    • Ideal para rastrear múltiplos elementos com uma só regra
    • Exemplo: rastrear todos os botões de "Saiba Mais" que possuem .btn-saiba-mais

  • Usando ID (meu-id):

    • Ideal para elementos únicos como formulários principais ou botões específicos
    • Exemplo: rastrear o envio do formulário principal com #form-contato
Dica

Use o inspetor de elementos do navegador (botão direito → Inspecionar) para identificar classes e IDs dos elementos que deseja rastrear.

Verificação e Monitoramento​

Após configurar seus eventos personalizados:

  1. Lista de Eventos Personalizados:

    • Todos os eventos criados aparecem na aba "Eventos"
    • Você pode editar ou remover eventos a qualquer momento

  2. Painel de Eventos Rastreados:

    • Na sidebar direita, veja os eventos disparados nas últimas 24 horas
    • Verifique se seus eventos estão sendo corretamente disparados

  3. Validação via Console:

    • Ao testar um novo evento, verifique o console do navegador
    • Procure por: Ⓜ️ Metrito: Event sent – [nome do evento]

Boas Práticas​

  • Evite duplicação: não crie múltiplos gatilhos para o mesmo elemento/ação
  • Use nomenclatura consistente: padronize os nomes de eventos para facilitar análises
  • Teste antes de publicar: verifique se os eventos estão disparando corretamente
  • Revisão periódica: se o design do site mudar, atualize os seletores CSS
Importante

Caso ocorram mudanças na estrutura HTML/CSS do seu site, pode ser necessário atualizar os seletores dos eventos personalizados para que continuem funcionando corretamente.

Guias de Instalação Específicos​

Guias de Integração de Checkouts​

Contents