Points clés
- La méthode recommandée pour le suivi du passage en caisse (checkout) et des achats est Paramètres → Événements client (le gestionnaire de pixels de Shopify).
- Pour les scripts spécifiques à une application, utilisez les blocs d’application (App Embeds) dans l’éditeur de thème plutôt que d’ajouter manuellement du code dans theme.liquid.
- Les scripts de thème et les scripts supplémentaires ne s’exécutent plus lors du paiement ou sur la page de remerciement, quel que soit le forfait, y compris Plus.
- Ajouter des scripts directement dans theme.liquid est la méthode la plus puissante mais la moins sûre : dupliquez d’abord votre thème.
Pour ajouter des scripts de suivi à Shopify, utilisez Paramètres → Événements client pour le suivi du passage en caisse et des achats, les App Embeds dans l’éditeur de thème pour les scripts d’application, et theme.liquid pour tout ce qui doit s’exécuter sur chaque page de la vitrine. Chaque méthode convient à un cas d’utilisation différent.
Comment ajouter un code de suivi sur Shopify ?
Il y a trois méthodes principales :
- Événements client (gestionnaire de pixels) - pour le suivi des événements d’achat et de passage en caisse
- App Embeds (Blocs d’application) - pour les scripts spécifiques aux applications
- theme.liquid - pour les scripts globaux sur toutes les pages de la vitrine (hors passage en caisse)
Pour vérifier que vos balises enregistrent bien les ventes une fois installées, consultez Comment suivre les conversions sur Shopify.
Méthode 1 — Événements clients (recommandé pour le suivi des conversions)
Le système d’événements client de Shopify (anciennement Shopify Pixels) est l’endroit approprié pour le suivi des achats et des événements de paiement. Il fonctionne sur l’ensemble du processus de paiement — y compris la page de statut de la commande — sur tous les forfaits Shopify.
Étape 1 - Allez dans Paramètres → Événements client
Étape 2 - Cliquez sur Ajouter un pixel personnalisé (pour le code personnalisé) ou parcourez la liste des intégrations prédéfinies (Google, Meta, TikTok, Klaviyo, etc.)
Étape 3 - Pour une intégration prédéfinie : cliquez sur l’intégration, connectez votre compte et activez-la. Shopify s’occupe du reste.
Étape 4 - Pour un pixel personnalisé : collez votre code de suivi dans l’éditeur JavaScript. Votre code s’exécute dans un environnement sandbox (bac à sable) et a accès aux événements standards de Shopify (page_viewed, product_viewed, checkout_completed, etc.)
Pourquoi est-ce la méthode recommandée : Les événements client s’exécutent dans un sandbox respectueux de la vie privée, respectent les paramètres de consentement des clients et ont un accès complet aux événements de paiement que les scripts de theme.liquid ne peuvent pas atteindre.
Pour le code des pixels personnalisés et les noms des événements, consultez Comment ajouter des événements personnalisés sur Shopify.
Méthode 2 — App Embeds dans l’éditeur de thème
Lorsque vous installez une application Shopify qui inclut un snippet JavaScript (comme un widget d’avis, un live chat ou un programme de fidélité), la bonne manière de l’activer est de passer par les App Embeds :
Étape 1 - Allez dans Boutique en ligne → Thèmes → Personnaliser
Étape 2 - Cliquez sur l’icône de pièce de puzzle dans la barre latérale gauche (App Embeds / Intégrations de l’application)
Étape 3 - Activez (toggle) l’application que vous souhaitez utiliser
Cette méthode maintient les scripts de vos applications bien organisés, facilite leur activation ou désactivation sans avoir à toucher au code, et évite de laisser des balises de script résiduelles si plus tard vous désinstallez l’application.
Méthode 3 — theme.liquid (pour les scripts globaux)
Pour les scripts qui doivent s’exécuter sur chaque page de votre boutique (à l’exclusion du passage en caisse), vous pouvez les ajouter directement dans theme.liquid.
Étape 1 - Allez dans Boutique en ligne → Thèmes, cliquez sur le menu à trois points (…) à côté de votre thème, puis sur Modifier le code
Étape 2 - Ouvrez theme.liquid
Étape 3 - Ajoutez les scripts dans la section <head> (pour les scripts qui doivent se charger tôt) ou juste avant la balise de fermeture </body> (pour les scripts non critiques)
Dupliquez toujours votre thème en premier. Une erreur de syntaxe dans theme.liquid casse l’ensemble de votre vitrine.
Utilisez defer ou async sur les balises de script lorsque c’est possible pour éviter de bloquer le rendu de la page :
<script src="https://example.com/script.js" defer></script>Comment ajouter un script sur la page de paiement (checkout) dans Shopify ?
Tous les forfaits, y compris Plus : les scripts de thème et les scripts supplémentaires ne s’exécutent plus lors du paiement ou sur la page de remerciement. checkout.liquid est désactivé et le champ Scripts supplémentaires est en lecture seule (Plus depuis août 2025, tous les forfaits depuis août 2026).
Utilisez les événements client (pixels personnalisés ou d’application) pour le suivi, et les extensions d’interface utilisateur de paiement (checkout UI extensions) pour tout ce que les acheteurs voient.
Vous quittez checkout.liquid ? Consultez Passer de checkout.liquid aux extensions de paiement.
Les erreurs courantes liées aux scripts de suivi
Installer un pixel deux fois. Si vous utilisez l’intégration Meta native de Shopify ET que vous collez manuellement le code du Pixel Meta dans theme.liquid, les événements d’achat se déclencheront deux fois. N’utilisez qu’une seule méthode.
Absence de gestion du consentement. Si vous opérez dans l’UE ou en Californie, vous avez besoin d’une bannière de consentement et vos scripts de suivi ne doivent se déclencher que pour les utilisateurs consentants. Le système d’événements client gère cela correctement lorsqu’il est bien configuré.
Scripts bloquant le chargement de la page. Les scripts qui bloquent le rendu (render-blocking scripts) dans <head> retardent l’affichage de votre page. Ajoutez les attributs async ou defer à tous les scripts de suivi non critiques.
Pour les balises lentes à charger, consultez Comment corriger les scripts qui bloquent le rendu sur Shopify.
Utiliser Google Tag Manager comme source unique de vérité
Plutôt que d’ajouter plusieurs scripts de suivi directement sur Shopify, de nombreuses boutiques utilisent Google Tag Manager (GTM) comme conteneur. Vous ajoutez le snippet GTM une seule fois à theme.liquid, puis vous gérez tous les autres scripts de suivi dans GTM.
Avantages : aucune modification de code nécessaire lors de l’ajout ou de la modification du suivi, ajout et suppression de scripts plus simples pour les non-développeurs, outils de débogage intégrés.
Consultez notre guide complet : Comment ajouter Google Tag Manager à Shopify.
FAQ
Dois-je utiliser les Événements client ou theme.liquid pour le suivi ?
Les Événements client pour tout suivi nécessitant une couverture du passage en caisse (événements d'achat, conversions, pixels publicitaires). theme.liquid pour les scripts qui n'ont besoin de s'exécuter que sur les pages de la vitrine et n'ont pas besoin d'accéder au passage en caisse. La plupart des boutiques finissent par utiliser les deux : les Événements client pour le suivi des conversions, theme.liquid (ou GTM) pour les analyses de la vitrine et les cartes de chaleur (heatmaps).
Pourquoi Shopify limite-t-il l'accès aux scripts de paiement ?
Pour des raisons de sécurité et de cohérence. Autoriser des scripts tiers arbitraires sur la page de paiement crée un risque d'altération du flux de paiement et des problèmes de conformité PCI. Le sandbox des Événements client vous permet d'exécuter du JavaScript dans un environnement sûr avec le même accès effectif à des fins de suivi - juste sans accès direct au DOM.
Puis-je ajouter des scripts de suivi via des applications Shopify au lieu de theme.liquid ?
Oui - de nombreuses plateformes publicitaires et outils d'analyse ont des applications Shopify officielles qui gèrent l'injection de scripts via les App Embeds, ce qui est la méthode la plus propre. Les intégrations prédéfinies d'Événements client gèrent également cela. Pour un suivi personnalisé qui n'a pas d'application officielle (événements dataLayer sur mesure, gestionnaires de clics ciblés, déclenchements de conversions personnalisés), décrivez ce que vous voulez à Fudge, l'opérateur IA pour les boutiques Shopify, et il écrit le code de suivi dans votre thème sous forme de brouillon que vous vérifiez avant sa mise en ligne.
L'ajout de scripts de suivi nuira-t-il à mon score Lighthouse sur Shopify ?
C'est possible. Chaque balise ajoute du JavaScript qui prend du temps à être analysé et exécuté. Utilisez defer ou async sur chaque référence de script externe, et privilégiez le sandbox des Événements client (qui s'exécute hors bande par rapport au rendu principal de la page). Des audits avec WebPageTest ou Lighthouse montreront quels scripts spécifiques sont le goulot d'étranglement.
Comment puis-je vérifier quels scripts de suivi se déclenchent réellement sur ma boutique ?
Ouvrez la page dans les Chrome DevTools → Onglet Réseau (Network) → filtrez par votre domaine de suivi (par ex., google-analytics, facebook). Vous verrez chaque requête que la page fait à ces services. Pour les Événements client en particulier, le flux d'événements en direct dans Paramètres → Événements client montre quels pixels se déclenchent en temps réel.
