Shopify : suivre la complétion de checkout dans Shopify

Le checkout de Shopify tourne sur un domaine séparé du reste de votre boutique, donc le script de tracking habituel ne peut pas suivre les visiteurs à travers. Pour capturer les complétions de checkout, utilisez l'un des deux hooks Shopify natifs ci-dessous.

Approche 1 — Pixel Customer Events (recommandé)

L'API Customer Events de Shopify tourne dans un iframe sandbox sur toutes les pages de checkout, y compris l'étape de succès. C'est la méthode supportée pour ajouter des pixels de tracking en 2026.

1. Dans votre admin Shopify, allez dans Settings → Customer events → Add custom pixel.
2. Nommez-le « Zenovay tracker ».
3. Collez ce code :

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

  // Charger le tracker Zenovay dans le sandbox du pixel
  const script = document.createElement('script');
  script.src = 'https://api.zenovay.com/z.js';
  script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
  script.defer = true;
  script.onload = () => {
    // ('revenue', amount, currency, properties)
    window.zenovay('revenue',
      Number(checkout.totalPrice.amount),
      checkout.totalPrice.currencyCode,
      {
        order_id: checkout.order.id,
        item_count: checkout.lineItems.length
      }
    );
  };
  document.head.appendChild(script);
});

4. Cliquez sur Save puis Connect. Les Customer Events tournent automatiquement à chaque checkout désormais.

Approche 2 — JS de la page de statut de commande (legacy)

Pour les boutiques Shopify Plus ou les thèmes plus anciens qui n'ont pas migré, vous pouvez toujours injecter du script dans Settings → Checkout → Order status page → Additional scripts :

<script>
(function() {
  var script = document.createElement('script');
  script.src = 'https://api.zenovay.com/z.js';
  script.setAttribute('data-tracking-code', 'YOUR_TRACKING_CODE');
  script.defer = true;
  script.onload = function() {
    window.zenovay && window.zenovay('revenue',
      {{ checkout.total_price | money_without_currency | replace:',','.' }},
      '{{ shop.currency }}',
      { order_id: '{{ checkout.order_id }}' }
    );
  };
  document.head.appendChild(script);
})();
</script>

Les placeholders Liquid à doubles accolades sont remplis par Shopify au moment de la confirmation de commande.

Important : ce qui se passe avec les paniers abandonnés

Aucune des approches ne se déclenche pour les paniers abandonnés — c'est voulu, vous ne voulez compter que les achats complétés. Pour suivre le drop-off du funnel de paniers abandonnés, installez le tracker habituel sur votre boutique et créez un funnel : /cart → /checkouts/... → goal purchase.

Vérifier que ça marche

1. Passez une commande de test sur votre boutique (utilisez Bogus Gateway en mode dev si vous ne voulez pas débiter une vraie carte).
2. Ouvrez le dashboard de votre site dans Zenovay et basculez vers l'onglet Live View. En ~30 secondes, la nouvelle session et la conversion devraient apparaître.
3. Le revenue doit également se refléter dans l'onglet Revenue.

Si l'événement n'apparaît pas :

• Ouvrez la page de statut de commande dans DevTools → onglet Network et cherchez une requête vers api.zenovay.com. Si elle manque, votre snippet n'a pas tourné.
• Vérifiez que YOUR_TRACKING_CODE est la bonne valeur. Vous pouvez la trouver dans le snippet d'installation de votre site (l'attribut data-tracking-code) — voir Aperçu de l'intégration Shopify pour voir où elle est affichée.
• Pour l'Approche 1, voyez la prévisualisation live du pixel dans Customer Events → [Votre pixel] → Test.

Disponibilité par plan

Le suivi du revenue est sur le plan Pro et supérieur. Les utilisateurs Free peuvent toujours envoyer un goal purchase avec l'une ou l'autre approche, mais l'onglet Revenue et l'attribution du revenue restent bloqués jusqu'à votre upgrade.

Articles liés

• Aperçu de l'intégration Shopify
• Suivi du revenue e-commerce
• Créer des goals