Ticketing: insérer un tracker Facebook / Google

Ce guide vous donne la liste des triggers à utiliser pour relier un tracker de type Google Tags et Facebook Pixel (dans le cadre du système de billetterie Infomaniak).

Ces triggers doivent être insérés dans la partie HEAD des options avancées sur votre boutique. Pour plus d'information à ce sujet, consulter le guide sur l'insertion des codes HTML sur votre billetterie

Exemples des Google Tags et Facebook Pixel

Documentation externes pour Facebook Pixel 
 

Exemple du code à insérer dans la billetterie pour Facebook Pixel :

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

Exemple google analytics avec gtag.js

Documentation externes :

• https://developers.google.com/analytics/devguides/collection/gtagjs/
• https://developers.google.com/analytics/devguides/collection/gtagjs/events

Exemple du code à insérer dans la billetterie pour Google Tags :

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
  });
});

Liste complète des triggers

Home page:

trigger : ike_home_view
Datas : none

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

Event page:

Page of an event with multiple dates
trigger : ike_event_view
Datas : detail.name

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

Date page:

Page of a date of an even
trigger : ike_date_view
Datas : detail.name, detail.date

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

Pass page:

Page of a pass category 
trigger : ike_abo_view
Datas : detail.name

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

Pass selection page:

Page of passes dates selection 
trigger : ike_abo_selection
Datas : detail (cart details)

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

User login:

Triggered login success 
trigger : ike_user_login
Datas : detail (cart details)

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

User logout:

trigger : ike_user_logout
Datas : detail (cart details)

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

Cart add:

Triggered when element added to cart

trigger : ike_cart_add
Datas : detail (cart details)

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

Cart page:

trigger : ike_cart_view
Datas : detail (cart details)

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

Cart update:

Triggered when a cart element is updated

trigger : ike_cart_update
Datas : detail (cart details)

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

Cart empty:

Triggered when empty button pressed

trigger : ike_cart_empty
Datas : detail (cart details)

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

Cart confirm:

Triggered when confirm button pressed

trigger : ike_cart_confirm
Datas : detail (cart details)

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

Cart delivery page:

trigger : ike_cart_delivery_view
Datas : detail (cart details)

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

Cart form page:

trigger : ike_cart_form_view
Datas : detail (cart details)

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

Cart payment page:

trigger : ike_cart_payment_view 
Datas : detail (cart details with paymentMethodSelected)

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

Cart payment changed:

trigger : ike_cart_payment_changed
Datas : detail.path

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

Cart payment launched:

trigger : ike_cart_payment_launched
Datas : detail (cart details)

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

Cart payment success page:

trigger : ike_cart_payment_success
Datas : detail (cart details)

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

Cart delete item:

trigger : ike_cart_delete
Datas : detail (previosCart and newCart)

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

Page Changed:

trigger : ike_page_changed
Datas : detail.path

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

En savoir plus 

• Guide de démarrage : Billetterie
• Personnaliser la billetterie en ligne avec les codes HTML, CSS, et JS