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

Points clés

• L’API Événements clients de Shopify (Paramètres → Événements clients → Ajouter un pixel personnalisé) est le bon endroit pour le suivi des événements personnalisés.
• Les événements standards de Shopify 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 paiement - 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 suivi des événements personnalisés vous indique ce que les acheteurs font réellement sur votre boutique — pas seulement les pages qu’ils visitent, mais quand ils ajoutent des produits à leur panier, commencent le paiement ou atteignent votre page de remerciement. L’API Événements clients de Shopify permet de suivre tout cela sans avoir à 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 une fois le paiement terminé :

À lire aussi : Ajouter Google Tag Manager à Shopify.

À lire aussi : Ajouter du JavaScript personnalisé dans 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.

Les événements Meta côté navigateur comme celui-ci sont filtrés par les bloqueurs de publicités et les paramètres de confidentialité d’iOS, associez-les donc à un suivi côté serveur - consultez la Configuration de l’API Conversions de Meta sur Shopify pour cette partie.

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