Comment Ajouter Des Événements Personnalisés Dans Shopify (2026)

À retenir

• L’API Customer Events de Shopify (Paramètres → Événements clients → Ajouter un pixel personnalisé) est le bon endroit pour le tracking personnalisé des événements.
• Les événements Shopify standards incluent page_viewed, product_viewed, product_added_to_cart et checkout_completed.
• Les pixels personnalisés s’exécutent dans un environnement sandbox avec un accès à tous les événements de checkout - ce que les scripts theme.liquid ne peuvent pas faire.
• Vous écrivez du JavaScript standard dans l’éditeur de pixel personnalisé - aucune syntaxe spécifique à Shopify n’est requise.

Le tracking personnalisé d’événements vous indique ce que les acheteurs font réellement sur votre boutique — pas seulement les pages qu’ils visitent, mais aussi quand ils ajoutent des produits à leur panier, quand ils commencent leur checkout ou atteignent votre page de remerciement. L’API Customer Events de Shopify permet de tracker tout cela sans devoir fouiller dans le code du thème.

Comment ajouter des événements dans Shopify ?

Allez dans Paramètres → Événements clients → Ajouter un pixel personnalisé. Cela ouvre un éditeur JavaScript où vous écrivez du code qui écoute les événements standards de Shopify et déclenche votre propre code de tracking en réponse.

Les événements standards de Shopify

Shopify expose un ensemble d’événements standards tout au long du parcours d’achat. Votre pixel personnalisé peut écouter n’importe lequel d’entre eux :

Événements de page :

• page_viewed — se déclenche à chaque chargement de page

Événements de produit :

• product_viewed — se déclenche lorsqu’une page produit est consultée
• product_added_to_cart — se déclenche lorsqu’un article est ajouté au panier
• search_submitted — se déclenche lorsqu’une recherche est effectuée

Événements de checkout :

• checkout_started — se déclenche au début du checkout
• checkout_address_info_submitted — se déclenche lorsque l’adresse est saisie
• checkout_shipping_info_submitted — se déclenche lorsque le mode de livraison est sélectionné
• payment_info_submitted — se déclenche lorsque les informations de paiement sont saisies
• checkout_completed — se déclenche sur la page de confirmation de commande
• order_created — se déclenche lorsqu’une commande est passée avec succès

Ces événements sont accompagnés de données contextuelles — le produit consulté, la valeur du panier au début du checkout, le total de la commande à la fin.

Sur le même sujet : Modifier checkout.liquid sur Shopify Plus.

Écrire un pixel personnalisé

Voici un exemple basique qui envoie un événement GA4 lorsqu’un produit est ajouté au panier :

analytics.subscribe('product_added_to_cart', (event) => {
    const cartLine = event.data.cartLine

    // Envoyer à GA4 via dataLayer (si GTM est installé)
    window.dataLayer = window.dataLayer || []
    window.dataLayer.push({
        event: 'add_to_cart',
        ecommerce: {
            currency: cartLine.merchandise.product.vendor,
            items: [
                {
                    item_id: cartLine.merchandise.sku,
                    item_name: cartLine.merchandise.product.title,
                    price: cartLine.cost.totalAmount.amount,
                    quantity: cartLine.quantity,
                },
            ],
        },
    })
})

Et pour un événement d’achat Meta Pixel à la fin du checkout :

Sur le même sujet : Ajouter Google Tag Manager à Shopify.

Sur le même sujet : Ajouter du JavaScript personnalisé sur Shopify.

analytics.subscribe('checkout_completed', (event) => {
    const order = event.data.checkout

    fbq('track', 'Purchase', {
        value: order.totalPrice.amount,
        currency: order.currencyCode,
        content_ids: order.lineItems.map((item) => item.variant.sku),
        content_type: 'product',
    })
})

Important : La fonction analytics.subscribe() est fournie par l’environnement sandbox de Shopify. Vous n’avez pas besoin de l’importer — elle est disponible automatiquement dans tous les pixels personnalisés.

Configurer un pixel personnalisé étape par étape

Étape 1 - Allez dans Paramètres → Événements client

Étape 2 - Cliquez sur Ajouter un pixel personnalisé

Étape 3 - Donnez-lui un nom (par ex. “GA4 Custom Events” ou “Meta Purchase Event”)

Étape 4 - Dans la section Code, écrivez votre JavaScript en utilisant analytics.subscribe()

Étape 5 - Définissez le niveau d’autorisation de confidentialité des clients :

• Non requis — se déclenche pour tous les visiteurs indépendamment de leur consentement
• Préférences — nécessite le consentement aux préférences
• Analytics — nécessite le consentement pour les analytics
• Marketing — nécessite le consentement marketing

Pour le tracking d’achat, sélectionnez “Marketing” si vous l’envoyez à des plateformes publicitaires, ou “Analytics” pour GA4.

Pour mesurer les résultats, voir ajouter des scripts de tracking sur Shopify.

Étape 6 - Cliquez sur Enregistrer puis sur Connecter

Tester votre pixel personnalisé

Le débogueur intégré de Shopify. Dans l’éditeur d’Événements clients, il y a un flux d’événements en direct qui montre les événements se déclencher en temps réel. Ouvrez votre boutique dans un autre onglet et naviguez dessus — vous devriez voir les événements page_viewed apparaître immédiatement.

La console du navigateur. Étant donné que les pixels personnalisés s’exécutent dans une iframe sandboxée, vous ne pouvez pas voir directement les sorties de leur console.log. Utilisez plutôt le panneau de débogage de Shopify.

GA4 DebugView. Dans votre propriété GA4, allez dans Configurer → DebugView. Déclenchez des événements sur votre boutique et regardez-les apparaître en temps réel.

Événements personnalisés vs intégrations d’applications standards

Shopify propose des intégrations prêtes à l’emploi pour Google Analytics, Google Ads, Meta, TikTok, Snapchat et d’autres dans la section Événements client. Celles-ci gèrent automatiquement le tracking standard des achats.

Utilisez des pixels personnalisés quand :

• Vous devez tracker des événements que l’intégration standard ne couvre pas (ex. clics sur des boutons spécifiques, profondeur de scroll, étapes d’un tunnel personnalisé)
• Vous devez envoyer des événements à une plateforme d’analytics moins courante
• Vous voulez envoyer des données personnalisées supplémentaires avec des événements standards (ex. lifetime value du client, catégorie de produit)

Pour la plupart des boutiques, les intégrations standards couvrent 80 % des besoins. Les pixels personnalisés comblent les manques.

FAQ