📖 Guia de Integração

Tutorial passo-a-passo de como usar o sistema de tracker nas suas presells, landing pages e funis.

Adicione o script na sua página

Cole o código abaixo antes do </body> da sua presell ou landing page. Troque SLUG-DA-CAMPANHA por um identificador único da sua campanha.

<!-- UTMify Tracker -->
<script
  src="https://www.verificar.sbs/js/tracker.js"
  data-campaign="SLUG-DA-CAMPANHA"
  defer
></script>

💡 O slug cria a campanha automaticamente

Não precisa cadastrar a campanha em lugar nenhum. No primeiro acesso com aquele slug, ela será criada e aparecerá no dashboard.

Configure os links das suas campanhas

Adicione os parâmetros UTM e click IDs nos links das suas campanhas de tráfego pago. O tracker captura tudo automaticamente da URL.

Parâmetros capturados automaticamente:

Parâmetro	Descrição	Exemplo
`utm_source`	Fonte do tráfego	facebook, tiktok, google
`utm_medium`	Tipo de mídia	cpc, cpm, email
`utm_campaign`	Nome da campanha no ads	black-friday-2026
`utm_content`	Variação do criativo/anúncio	video-depoimento, carrossel-01
`utm_term`	Palavra-chave (Google)	emagrecer rapido
`ttclid`	TikTok Click ID	Preenchido auto pelo TikTok
`fbclid`	Facebook Click ID	Preenchido auto pelo Facebook
`gclid`	Google Ads Click ID	Preenchido auto pelo Google
`sck`	SmartClick / Subid	Personalizado
`src`	Source genérica / Subid	Personalizado

Exemplo de link no TikTok Ads:

https://suapresell.com/?utm_source=tiktok&utm_medium=cpc&utm_campaign=__CAMPAIGN_NAME__&utm_content=__AID__&ttclid=__CLICKID__

Exemplo de link no Facebook Ads:

https://suapresell.com/?utm_source=facebook&utm_medium=cpc&utm_campaign={{campaign.name}}&utm_content={{ad.name}}&fbclid={{click_id}}

Exemplo de link no Google Ads:

https://suapresell.com/?utm_source=google&utm_medium=cpc&utm_campaign={campaignname}&utm_term={keyword}&gclid={gclid}

Rastreie cliques e eventos

O tracker captura cliques em botões (<button>) e links CTA automaticamente. Para rastrear elementos específicos, use os atributos data-track-click.

Rastreamento automático (botões e links .btn/.cta):

<!-- Rastreados automaticamente -->
<button>Comprar Agora</button>
<a href="/checkout" class="btn">Finalizar Compra</a>
<a href="/oferta" class="cta">Ver Oferta</a>

Rastreamento com atributo personalizado:

<!-- data-track-click = nome do evento -->
<!-- data-track-label = label descritivo (opcional) -->
<div data-track-click="assistir_video" data-track-label="Video Depoimento">
  ▶️ Assista o vídeo
</div>

<button data-track-click="iniciar_checkout" data-track-label="Botão Verde">
  QUERO COMPRAR AGORA
</button>

Rastreamento via JavaScript (manual):

<script>
// Evento simples
Tracker.track('lead', 'Formulário Topo');

// Evento com metadata extra
Tracker.track('purchase', 'Checkout Final', {
  value: 97.00,
  product: 'Curso XYZ',
  payment: 'pix'
});

// Obter IDs para enviar a outros sistemas
var visitorId = Tracker.getVisitorId();
var viewId    = Tracker.getViewId();
</script>

Integração direta via API (sem script)

Se preferir enviar os dados diretamente do backend (checkout, webhook, etc.), use a API REST.

Registrar uma visualização:

POST https://www.verificar.sbs/api/track/view
Content-Type: application/json

{
  "campaign_slug": "minha-campanha",
  "visitor_id": "vis_abc123",
  "url": "https://suapresell.com/oferta",
  "referrer": "https://facebook.com",
  "utm_source": "tiktok",
  "utm_medium": "cpc",
  "utm_campaign": "campanha-principal",
  "utm_content": "criativo-01",
  "utm_term": null,
  "ttclid": "E.C.xxxxx",
  "fbclid": null,
  "gclid": null,
  "sck": null,
  "src": "subid123"
}

Registrar um evento:

POST https://www.verificar.sbs/api/track/event
Content-Type: application/json

{
  "campaign_slug": "minha-campanha",
  "visitor_id": "vis_abc123",
  "view_id": 42,
  "event_name": "purchase",
  "event_label": "Checkout PIX",
  "metadata": {
    "value": 97.00,
    "product": "Curso XYZ",
    "transaction_id": "TXN_001"
  }
}

Exemplo completo: Presell + Checkout

1. Presell (página de aquecimento):

<!DOCTYPE html>
<html>
<body>
  <h1>Descubra o Método...</h1>
  <p>Conteúdo de aquecimento aqui...</p>

  <a href="/checkout" class="btn"
     data-track-click="ir_checkout"
     data-track-label="Botão CTA Presell">
    QUERO GARANTIR MINHA VAGA →
  </a>

  <!-- UTMify Tracker -->
  <script src="https://www.verificar.sbs/js/tracker.js"
          data-campaign="lancamento-jun2026" defer></script>
</body>
</html>

2. Página de Checkout (evento de compra):

<!-- Mesmo script na página de checkout -->
<script src="https://www.verificar.sbs/js/tracker.js"
        data-campaign="lancamento-jun2026" defer></script>

<script>
// Quando o pagamento for confirmado
function onPaymentSuccess(order) {
  Tracker.track('purchase', 'Pedido Confirmado', {
    value: order.total,
    product: order.product_name,
    payment_method: order.payment
  });
}
</script>

⚠️ Importante: mesmo slug em todas as páginas do funil

Use o mesmo data-campaign na presell e no checkout para que os dados fiquem vinculados. O visitor_id persiste via localStorage automaticamente.

⚡ Referência Rápida

O que quer fazer	Como
Registrar visita na página	Automático ao carregar o script
Capturar UTMs e click IDs	Automático — basta ter na URL
Rastrear clique em botão	Automático para `<button>` e `.btn / .cta`
Rastrear elemento específico	`data-track-click="nome"`
Disparar evento via JS	`Tracker.track('evento', 'label', {dados})`
Enviar via backend (webhook)	`POST /api/track/event`
Criar nova campanha	Automático no primeiro hit de qualquer slug
Manter visitor entre páginas	Automático via localStorage

🚀 Testar agora com parâmetros de exemplo