Este guia apresenta a lista de gatilhos a serem utilizados para seus rastreadores do tipo Google Tags e pixel Meta (Facebook) em sua loja (no âmbito do sistema de emissão de bilhetes Infomaniak).

Exemplos de pixel Meta e tags do Google

Consulte a documentação externa para o pixel Meta:

!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');

document.addEventListener("ike_event_view", function( e ) {
  fbq('init', '14085424191xxxxx');
  fbq('track', "PageView");
  fbq('track', 'InitiateCheckout');
});

document.addEventListener("ike_cart_payment_launched", function( e ) {
  fbq('init', '14085424191xxxxx');
  fbq('track', "PageView");
  fbq('track', 'Purchase', {value: e.detail.topaid, currency: e.detail.currency.name});
});

… e para o Google Tag Manager (GTM) + gtag.js:

window.dataLayer = window.dataLayer || [ ];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-xxxxxxx-x');

document.addEventListener("ike_event_view", function( e ) {
  gtag('event', 'view_item', {
    'event_category' : e.detail.name,
    'event_label' : e.detail.date
  });
});

document.addEventListener("ike_cart_add", function( e ) {
  gtag('event', 'add_to_cart');
});

document.addEventListener("ike_cart_confirm", function( ) {
  gtag('event', 'checkout_progress', {
    'event_category' :'carrinho validado'
  });
});

document.addEventListener("ike_cart_payment_launched", function( e ) {
  gtag('event', 'add_payment_info', {
    'event_category' : 'pagamento',
    'event_label' : e.detail.currency.name,
    'value': e.detail.topaid
  });
});

No Google Tag Manager, certifique-se de que o formato das tags seja respeitado:

(view_item|add_cart|add_payment_info)

CSP e seu impacto no rastreamento de conversões

A “Política de Segurança de Conteúdo” (CSP) é uma política de segurança da web que protege as páginas contra certos ataques, como o Cross-Site Scripting (XSS) e a injeção de conteúdo malicioso. No entanto, ela também pode bloquear alguns scripts legítimos, como os pixels de rastreamento do Meta ou do Google Tag Manager, impedindo, assim, o bom funcionamento do rastreamento de conversões.

Por que alguns pixels não funcionam?

Se o seu site apresentar um erro relacionado com a Política de Segurança de Conteúdo (CSP), especialmente no console ou no separador de rede das ferramentas de desenvolvimento do navegador, isso significa que alguns scripts de terceiros — como as etiquetas do Google ou os pixels do Meta (Facebook) — estão bloqueados. Para garantir o bom funcionamento do rastreamento de conversões na sua loja, é necessário adicionar uma exceção específica na configuração CSP do seu site, a fim de autorizar os recursos utilizados pelo sistema de bilheteira da Infomaniak.

Principais diretivas CSP que afetam o rastreamento

• script-src: define as fontes permitidas para os scripts.
• img-src: controla as imagens (incluindo as tags <img> usadas para os pixels de rastreamento).
• connect-src: gerencia as solicitações de rastreamento enviadas aos servidores das ferramentas de marketing.

Por exemplo, se você usa o Google Tag Manager ou o Facebook Pixel, certifique-se de que sua política CSP autorize explicitamente o carregamento de scripts e o envio de dados para seus domínios. Aqui está um exemplo de diretivas a serem incluídas em sua CSP, a serem adaptadas de acordo com sua configuração:

script-src 'self' https://www.googletagmanager.com https://www.google-analytics.com https://connect.facebook.net;
img-src 'self' https://www.google-analytics.com https://www.facebook.com;
connect-src 'self' https://www.google-analytics.com https://www.facebook.com;

O Google fornece um guia detalhado sobre a configuração de CSP compatível com suas ferramentas de rastreamento.

Verifique também se o seu sistema de gestão de segurança (firewall de aplicação, CDN, CMS) não está a bloquear estes recursos e aplique os ajustes necessários para permitir o correto acionamento dos eventos de rastreamento.

Se a sua política de segurança de conteúdo (CSP) for demasiado restritiva, ela pode impedir o carregamento de scripts de terceiros, como:

• Pixel do Facebook (connect.facebook.net)
• Google Tag Manager (GTM) (www.googletagmanager.com)
• Google Analytics (www.google-analytics.com)

Erros visíveis na consola do programador (Ferramentas de desenvolvimento do navegador):

Recusado carregar o script 'https://connect.facebook.net/en_US/fbevents.js'
porque viola a seguinte diretiva da Política de Segurança de Conteúdo: "script-src 'self'"

• Ausência de dados no Google Analytics ou no Facebook Ads Manager.
• Falha ao acionar os eventos definidos no GTM.

Quando a CSP bloqueia esses recursos, eles não podem coletar dados sobre os visitantes ou registrar eventos de conversão.

Lista completa dos gatilhos

Página inicial:

gatilho: ike_home_view
Dados: nenhum

document.addEventListener("ike_home_view", function(e) {
  //enviar para sua ferramenta de rastreamento
});

Página de evento:

Página de um evento com várias datas
gatilho: ike_event_view
Dados: detail.name

document.addEventListener("ike_event_view", function(e) {
  console.log(e.detail.name); 
  //enviar para sua ferramenta de rastreamento
});

Página de data:

Página com a data de um evento
gatilho: ike_date_view
Dados: detail.name, detail.date

document.addEventListener("ike_date_view", function(e) {
  console.log(e.detail.name, e.detail.date);
  //enviar para sua ferramenta de rastreamento
});

Página de passagem:

Página de uma categoria de passagem
gatilho: ike_abo_view
Dados: detail.name

document.addEventListener("ike_abo_view", function(e) {
  console.log(e.detail.name);
  //enviar para sua ferramenta de rastreamento
});
```
Página de seleção de plano:

Pass selection page:

Página de seleção de datas dos passes
gatilho: ike_abo_selection
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_abo_selection", function(e) {
  console.log(e.detail.name, e.detail.date);
  //enviar para sua ferramenta de rastreamento
});

Login do usuário:

Disparado após o login bem-sucedido
gatilho: ike_user_login
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_user_login", function(e) {
  console.log(e.detail);
  // envie para sua ferramenta de rastreamento
});
```
Logout do usuário:

User logout:

gatilho: ike_user_logout
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_user_logout", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});

Adicionar ao carrinho:

Ativado quando um item é adicionado ao carrinho.

gatilho: ike_cart_add
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_add", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});

Página do carrinho:

gatilho: ike_cart_view
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_view", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});
```
Atualização do carrinho:

Cart update:

Disparado quando um item do carrinho é atualizado

gatilho: ike_cart_update
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_update", function(e) {
  console.log(e.detail);
  //envie para sua ferramenta de rastreamento
});

Carrinho vazio:

Ativado quando o botão vazio é pressionado

evento: ike_cart_empty
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_empty", function(e) {
  console.log(e.detail);
  //envie para sua ferramenta de rastreamento
});

Confirmação do carrinho:

Ativado quando o botão de confirmação é pressionado

gatilho: ike_cart_confirm
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_confirm", function(e) {
  console.log(e.detail);
  //envie para sua ferramenta de rastreamento
});

Página de confirmação do carrinho:

gatilho: ike_cart_delivery_view
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_delivery_view", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});

Página do formulário do carrinho:

gatilho: ike_cart_form_view
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_form_view", function(e) {
  console.log(e.detail);
  //envie para sua ferramenta de rastreamento
});

Página de pagamento do carrinho:

gatilho: ike_cart_payment_view
Dados: detalhes (detalhes do carrinho com o método de pagamento selecionado)

document.addEventListener("ike_cart_payment_view", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});

Pagamento do carrinho alterado:

gatilho: ike_cart_payment_changed
Dados: detail.path

document.addEventListener("ike_cart_payment_changed", function(e) {
  console.log(e.detail);
  // envie para sua ferramenta de rastreamento
});
```
Pagamento do carrinho iniciado:

Cart payment launched:

gatilho: ike_cart_payment_launched
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_payment_launched", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});

Página de sucesso do pagamento com cartão:

gatilho: ike_cart_payment_success
Dados: detalhes (detalhes do carrinho)

document.addEventListener("ike_cart_payment_success", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});
```
Remover item do carrinho:

Cart delete item:

gatilho: ike_cart_delete
Dados: detalhes (carrinho anterior e novo carrinho)

document.addEventListener("ike_cart_delete", function(e) {
  console.log(e.detail);
  //enviar para sua ferramenta de rastreamento
});

Página alterada:

gatilho: ike_page_changed
Dados: detail.path

document.addEventListener("ike_page_changed", function(e) {
  console.log(e.detail);
  // envie para sua ferramenta de rastreamento
});