Suivre les événements e-commerce Shopify avec Personyze

Vous utilisez l’application Personyze pour Shopify ? Vous n’avez peut-être pas besoin de ceci. L’application intègre pour vous le code de suivi dans votre thème et synchronise automatiquement votre catalogue de produits — voir Installer Personyze sur une boutique Shopify. Le code ci-dessous sert à signaler des événements depuis le bac à sable Customer Events de Shopify (paiement et extension de panier), qui s’exécute séparément de votre thème, ou pour les boutiques qui n’utilisent pas l’application.

Pour signaler à Personyze l’activité e-commerce de Shopify, comme les vues de produits, les interactions avec le panier et les achats, suivez les étapes ci-dessous pour intégrer le code JavaScript nécessaire à votre site.

Étape 1 : initialiser le pixel de suivi Personyze

Insérez l’extrait JavaScript suivant dans l’en-tête global de votre site (avant la balise de fermeture </head> ). Il charge le SDK Personyze et l’initialise pour votre compte :

window._S_T || function(s)
{
    s.async = true;
    s.src = '//counter.personyze.com/stat-track-lib.js';
    s.onload = function()
    {
        _S_T.async = true;
        _S_T.setup(YOUR-ACCOUNT-ID, "*.yourdomain.com");
    };
    (document.querySelector('head') || document.documentElement).appendChild(s);
}(document.createElement('script'));

Étape 2 : s’abonner aux événements e-commerce

Utilisez l’API Shopify analytics.subscribe pour capturer les actions clés des clients et les transmettre à Personyze. Voici des exemples pour signaler chaque type d’événement :

Produit consulté

analytics.subscribe(
    "product_viewed",
    event => {
        if (event?.data?.productVariant) {
            console.log("Event data ", event.data);
            (self.personyze = self.personyze || []).push([
                'Product Viewed',
                event.data.productVariant.id
            ]);
        }
    }
);

Produit ajouté au panier

analytics.subscribe(
    "product_added_to_cart",
    event => {
        if (event?.data?.cartLine) {
            console.log("Event data ", event.data);
            (self.personyze = self.personyze || []).push([
                'Product Added to cart',
                event.data.cartLine.merchandise.id,
                'quantity',
                event.data.cartLine.quantity
            ]);
        }
    }
);

Produit retiré du panier

analytics.subscribe(
    "product_removed_from_cart",
    event => {
        console.log("Event data ", event.data);
        (self.personyze = self.personyze || []).push([
            'Product Removed from cart',
            event.data.cartLine.merchandise.id,
            'quantity',
            event.data.cartLine.quantity
        ]);
    }
);

Paiement finalisé

analytics.subscribe(
    "checkout_completed",
    event => {
        console.log("Event data ", event.data);
        (self.personyze = self.personyze || []).push([
            'Products Purchased'
        ]);
    }
);

Une fois ces scripts intégrés, Personyze reçoit automatiquement les données d’événements en temps réel, ce qui lui permet de personnaliser le contenu, de suivre les conversions et de générer des analyses pour votre entonnoir e-commerce. 📌 Astuce : testez toujours les événements dans la console de votre navigateur et vérifiez le suivi dans le simulateur Personyze.