Questa guida ti fornisce l'elenco dei trigger da utilizzare per i tuoi tracker di tipo Google Tags e pixel Meta (Facebook) del tuo negozio (nel contesto del sistema di biglietteria Infomaniak).

Esempi di pixel Meta e Google Tags

Consulta la documentazione esterna per il 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 per il 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.name,
    'event_label' : e.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' :'valid cart'
  });
});

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

Su Google Tag Manager, assicurarsi che il formato per i tag sia rispettato:

(view_item|add_cart|add_payment_info)

CSP e il suo impatto sul tracciamento delle conversioni

La “Content Security Policy” (CSP) è una politica di sicurezza web che protegge le pagine da alcuni attacchi come il Cross-Site Scripting (XSS) e l'iniezione di contenuti maliziosi. Tuttavia, può anche bloccare alcuni script legittimi, come i pixel di tracciamento Meta o Google Tag Manager, impedendo così il corretto funzionamento del tracciamento delle conversioni.

Perché alcuni pixel non funzionano?

Se la tua CSP è troppo restrittiva, può impedire il caricamento degli script di terze parti come:

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

Errori visibili nella console dello sviluppatore (Strumenti di sviluppo del browser) :

Refused to load the script 'https://connect.facebook.net/en_US/fbevents.js'
because it violates the following Content Security Policy directive: "script-src 'self'"

• Assenza di dati in Google Analytics o Facebook Ads Manager.
• Errore nel trigger degli eventi definiti in GTM.

Quando la CSP blocca queste risorse, non possono raccogliere dati sui visitatori o registrare eventi di conversione.

Principali direttive CSP che influenzano il tracciamento

• script-src : definisce le fonti autorizzate per gli script.
• img-src : controlla le immagini (inclusi i tag <img> utilizzati per i pixel di tracciamento).
• connect-src : gestisce le richieste di tracciamento inviate ai server degli strumenti di marketing.

Elenco completo dei trigger

Pagina iniziale:

trigger : ike_home_view
Dati : nessuno

document.addEventListener("ike_home_view", function(e) {
  //send to your tracking tool
});

Pagina evento:

Pagina di un evento con date multiple
trigger : ike_event_view
Dati : detail.name

document.addEventListener("ike_home_view", function(e) {
  console.log(e.detail.name);  
  //send to your tracking tool
});

Pagina della data:

Pagina di una data di un evento
trigger : ike_date_view
Dati : detail.name, detail.date

document.addEventListener("ike_home_view", function(e) {
  console.log(e.detail.name, e.detail.date);
  //send to your tracking tool
});

Pagina Pass:

Pagina di una categoria di pass
trigger : ike_abo_view
Dati : detail.name

document.addEventListener("ike_abo_view", function(e) {
  console.log(e.detail.name);
  //send to your tracking tool
});

Pagina di selezione dei pass:

Pagina di selezione delle date dei pass
trigger : ike_abo_selection
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_abo_selection", function(e) {
  console.log(e.detail.name, e.detail.date);
//send to your tracking tool
});

Accesso utente:

Accesso effettuato con successo
trigger : ike_user_login
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_user_login", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Disconnessione utente:

trigger : ike_user_logout
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_user_logout", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Aggiunta al carrello:

Attivato quando un elemento viene aggiunto al carrello

trigger : ike_cart_add
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_add", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagina del carrello:

trigger : ike_cart_view
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_view", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Aggiornamento carrello:

Attivato quando un elemento del carrello viene aggiornato

trigger : ike_cart_update
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_update", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Carrello vuoto:

Attivato quando viene premuto il pulsante svuota

trigger : ike_cart_empty
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_empty", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Conferma carrello:

Attivato quando viene premuto il pulsante di conferma

trigger : ike_cart_confirm
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_confirm", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagina di consegna del carrello:

trigger : ike_cart_delivery_view
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_delivery_view", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagina del modulo del carrello:

trigger : ike_cart_form_view
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_form_view", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagina di pagamento del carrello:

trigger : ike_cart_payment_view
Dati : dettaglio (dettagli del carrello con paymentMethodSelected)

document.addEventListener("ike_cart_payment_view", function(e) {
  console.log(e.detail);
  //send to your tracking tool 
});

Pagamento del carrello modificato:

trigger : ike_cart_payment_changed
Dati : detail.path

document.addEventListener("ike_cart_payment_changed", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagamento del carrello avviato:

trigger : ike_cart_payment_launched
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_payment_launched", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagina di successo del pagamento del carrello:

trigger : ike_cart_payment_success
Dati : dettaglio (dettagli del carrello)

document.addEventListener("ike_cart_payment_success", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Cancellazione elemento dal carrello:

trigger : ike_cart_delete
Dati : dettaglio (previosCart e newCart)

document.addEventListener("ike_cart_delete", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});

Pagina modificata:

trigger : ike_page_changed
Dati : detail.path

document.addEventListener("ike_page_changed", function(e) {
  console.log(e.detail);
  //send to your tracking tool
});