Affilae > Documentations > Intégration Shopify (Checkout.extensibility / pixel)

Intégration Shopify (Checkout.extensibility / pixel)

Suite aux dernières mises à jour de Shopify concernant sa page de remerciement de commande, il est désormais possible de poser les scripts Affilae via des pixels.
Vous trouverez-ci-après les différentes démarches pour installer Affilae dans ce cas.

Important : Avant de passer à l’étape de tracking, veuillez obligatoirement contacter l’équipe support afin qu’elle réalise en parallèle des vérifications de votre tracking. 

 

Tracker les clics de vos partenaires affiliés

  Afin de tracker les clics envoyés par vos partenaires, le script ci-dessous doit être poser sur toutes les pages du site dans la balise<body>. Pour le faire dans votre Shopify, rendez-vous dans l’admin et cliquez sur :

  • Le menu Online store / Boutique en ligne 
  • Cliquez sur le bouton Thème 
  • Puis, le bouton  Actions 
  • Et sur Edit HTML / CSS / Modifier le code 

Sélectionnez ensuite le fichier theme.liquid dans l’arborescence et ajouter le code suivant dans la balise <body>.

➜ Attention, ce script est exemple, vous devez remplacer le champ PROGRAM_ID par le program ID disponible dans la partie configuration de votre interface, puis tracking et enfin intégrations avec un module Affilae.

<!-- STARTING AFFILAE TRACKING CODE -->

<script type="text/javascript">
    var _ae = {
        "pid":"PROGRAM_ID",
    };
    (function() {
        var element = document.createElement('script'); element.type = 'text/javascript'; element.async = true;
        element.src = '//static.affilae.com/ae-v3.5.js';
        var scr = document.getElementsByTagName('script')[0]; scr.parentNode.insertBefore(element, scr);
    })();
</script>

<!-- ENDING AFFILAE TRACKING CODE -->
Tracking des clics Shopify

 

 

Tracker les ventes de vos partenaires affiliés

 

Dans l’admin Shopify, veuillez vous rendre dans les paramètres puis sur la page évènements clients. C’est sur cette page que vous allez pouvoir ajouter le pixel de tracking des ventes. 

Voici les différentes étapes :

  • Cliquez sur le bouton ajouter un pixel personnalisé. 

 

  • Nommer votre pixel

 

  • Supprimer le texte de l’encart et le remplacer par le pixel suivant :

const PROGRAM_ID = 'YOUR.PROGRAM_ID';
const KEY = 'YOUR.KEY';
const AFFILAE_TRACKING = 'https://lb.affilae.com/';
const VERSION = '1.0';
const aeCids = browser.cookie.get('_affilae' + PROGRAM_ID).then(aeCids => {
    // https://shopify.dev/docs/api/web-pixels-api/standard-events/checkout_completed
    analytics.subscribe('checkout_completed', (event) => {
        const checkout = event.data.checkout;
        const discountCodes = checkout.discountApplications.map((discount) => {
            if (discount.type === 'DISCOUNT_CODE') {
                return discount.title + ';';
            }
        });
        const productIds = checkout.lineItems.map((line) => {
            return line.variant.product.id + ';';
        });

        let aeConvUrl = AFFILAE_TRACKING + '?key=' + KEY;
        aeConvUrl = aeConvUrl + '&id=' + checkout.order.id;
        aeConvUrl = aeConvUrl + '&amount=' + checkout.subtotalPrice.amount;
        aeConvUrl = aeConvUrl + '&payment=' + 'online';
        aeConvUrl = aeConvUrl + '&voucher=' + discountCodes;
        aeConvUrl = aeConvUrl + '&product=' + productIds;
        aeConvUrl = aeConvUrl + '&currency=' + checkout.subtotalPrice.currencyCode;
        aeConvUrl = aeConvUrl + '&customer=' + event.clientId;
        aeConvUrl = aeConvUrl + '&cids=' + aeCids;
        aeConvUrl = aeConvUrl + '&source=shopify';
        aeConvUrl = aeConvUrl + '&v=' + VERSION;

        fetch(aeConvUrl, {
            'method': 'GET',
            'keepalive': true,
        });
    });
}).catch((error) => {
    console.log(error);
});
Tracking des ventes Shopify (Pixel)

 

Il faut dans ce script modifier deux informations :

Ligne 2 : Remplacer la variable ‘YOUR.PROGRAM_ID‘ par le program ID disponible dans la configuration de votre interface, puis tracking et enfin intégrations avec un module Affilae.

Ligne 3 : Remplacer la variable ‘YOUR.KEY‘ par la clé du code de conversion disponible aussi dans la partie intégrations avec un module Affilae de la configuration de votre programme.

 

Vous aurez alors un pixel qui ressemble à ceci :

 

Restera à sauvegarder et à connecter le pixel à votre boutique.

Votre pixel désormais connecté, vous pouvez passer à l’étape du test des trackings.

 

© Affilae. Plateforme d'affiliation. Tous droits réservés.