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

Points clés à retenir

• L’API Customer Events de Shopify (Paramètres → Événements clients → Ajouter un pixel personnalisé) est le bon endroit pour le tracking d’é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 checkout - ce que les scripts theme.liquid ne peuvent pas faire.
• Vous écrivez du JavaScript standard dans l’éditeur de pixels personnalisés - aucune syntaxe spécifique à Shopify n’est requise.

Le tracking d’é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, quand ils commencent le checkout ou atteignent votre page de remerciement. L’API Customer Events de Shopify rend tout cela trackable 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 une série 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 produits :

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

Événements de checkout :

• checkout_started — se déclenche au début du checkout
• checkout_address_info_submitted — se déclenche lors de la saisie de l’adresse
• checkout_shipping_info_submitted — se déclenche lors de la sélection du mode d’expédition
• payment_info_submitted — se déclenche lors de la saisie des infos de paiement
• 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 qui a été vu, la valeur du panier au début du checkout, le total de la commande à la fin.

Sur le même sujet : Modifier checkout.liquid dans 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é 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.

Configurer un pixel personnalisé étape par étape

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

Étape 2 - Cliquez sur Ajouter un pixel personnalisé

Étape 3 - Donnez-lui un nom (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 quel que soit leur consentement
• Préférences — nécessite le consentement lié aux analytiques
• Analytiques — nécessite le consentement lié aux analytiques
• Marketing — nécessite le consentement marketing

Pour le tracking des achats, sélectionnez “Marketing” si vous envoyez ces données à des plateformes publicitaires, ou “Analytiques” pour GA4.

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

Étape 6 - Cliquez sur Enregistrer puis 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 clients. Celles-ci gèrent le tracking des achats standards de façon automatique.

Utilisez les pixels personnalisés lorsque :

• 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 de funnel personnalisées)
• Vous devez envoyer des événements à une plateforme d’analytique moins courante
• Vous souhaitez envoyer des données personnalisées supplémentaires avec les événements standards (ex. customer lifetime value, catégorie de produit)

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