À retenir

La méthode recommandée pour le suivi des paiements (checkout) et des achats est Paramètres → Événements clients (le gestionnaire de pixels de Shopify).

Pour les scripts spécifiques aux applications, utilisez les App Embeds dans l’éditeur de thème plutôt que d’ajouter manuellement le code à theme.liquid.

L’accès des scripts tiers à la page de paiement est limité sur les forfaits Basic et Shopify — Shopify Plus offre des possibilités plus poussées.

L’ajout de scripts directement dans theme.liquid est la méthode la plus puissante mais la moins sûre — dupliquez toujours votre thème au préalable.

Les scripts de suivi alimentent vos publicités, vos analyses et votre reciblage (remarketing). Leur installation correcte dans Shopify est plus subtile que de simplement coller un snippet dans un header. Shopify propose plusieurs méthodes, chacune adaptée à des cas d’usage différents.

Comment ajouter un code de suivi sur Shopify ?

Il existe trois méthodes principales :

Événements clients (gestionnaire de pixels) — pour le suivi des achats et des événements de paiement (checkout)
App Embeds (intégrations d’application) — pour les scripts liés à une application spécifique
theme.liquid — pour les scripts globaux sur l’ensemble du site (à l’exception du checkout sur les forfaits de base)

Pour mesurer les résultats, consultez comment modifier checkout.liquid sur Shopify Plus.

Méthode 1 — Événements clients (recommandé pour le suivi des conversions)

Le système d’Événements clients (Customer Events) de Shopify (anciennement Shopify Pixels) est l’endroit approprié pour le suivi des achats et des événements de checkout. Il fonctionne sur l’ensemble du processus de paiement — y compris la page de statut de commande — pour tous les forfaits Shopify.

Article lié : Ajouter des événements personnalisés dans Shopify.

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

Étape 2 - Cliquez sur Ajouter un pixel personnalisé (pour un code spécifique) 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 accède aux événements standards de Shopify (page_viewed, product_viewed, checkout_completed, etc.).

Pourquoi est-ce l’approche recommandée : Les événements clients s’exécutent dans une sandbox respectueuse de la vie privée, prennent en compte les choix de consentement des clients et offrent un accès complet aux événements de checkout que les scripts présents dans theme.liquid ne peuvent pas atteindre sur les forfaits standards.

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 checkout sur les forfaits de base), vous pouvez les ajouter directement dans theme.liquid.

Étape 1 - Boutique en ligne → Thèmes → Actions → Modifier le code

Étape 2 - Ouvrez theme.liquid

Étape 3 - Ajoutez les scripts dans la section <head> (pour ceux qui doivent se charger tôt) ou juste avant la balise de fermeture </body> (pour les scripts secondaires)

Dupliquez toujours votre thème en premier. Une erreur de syntaxe dans theme.liquid bloque tout l’affichage de votre boutique.

Utilisez defer ou async sur vos balises de script dès que 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 ?

L’accès aux scripts de la page de paiement dépend de votre forfait Shopify :

Forfaits Basic, Shopify et Advanced : Il est impossible d’ajouter des scripts directement sur les pages de paiement via theme.liquid. Utilisez plutôt les Événements clients — ils ont un accès naturel à tous les événements du checkout.

Shopify Plus : Vous avez accès à checkout.liquid pour la page de paiement. Profitez également des Shopify Functions et de Checkout Extensibility pour plus de personnalisation avancée.

Tous les forfaits : La page de statut de commande (page de remerciement) peut accueillir des scripts supplémentaires via Paramètres → Passage en caisse (Checkout) → Page de statut de commande (faites défiler jusqu’en bas des paramètres de paiement pour trouver le champ “Scripts supplémentaires”).

Les erreurs courantes liées aux scripts de suivi

Installer un pixel en double. 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. Choisissez une seule méthode.

L’absence de gestion du consentement. Si vous opérez en Europe ou en Californie, une bannière de consentement est obligatoire et vos scripts de suivi ne doivent se déclencher que pour les utilisateurs y ayant consenti. Le système des Événements clients gère cela correctement dès lors qu’il est bien configuré.

Les scripts qui bloquent le chargement de la page. Les scripts bloquant le rendu (render-blocking) placés dans <head> retardent l’affichage de l’ensemble de la page. Ajoutez systématiquement l’attribut async ou defer à tous les scripts non critiques.

Ajoutez des éléments de suivi et de conversion à votre boutique Shopify.

Try Fudge for Free

Pour mesurer les performances, consultez les moyens de corriger les scripts render-blocking dans Shopify.

Utiliser Google Tag Manager comme source unique de vérité

Plutôt que d’ajouter de multiples scripts de suivi directement dans Shopify, de nombreux marchands choisissent Google Tag Manager (GTM) comme conteneur global. Il vous suffit d’ajouter le snippet GTM une seule fois dans theme.liquid, puis de gérer absolument tous vos autres outils depuis GTM.

Avantages : aucune modification de code requise pour ajouter ou reconfigurer du suivi, gestion accessible pour les profils non-développeurs, et un outil de débogage intégré très pratique.

Consultez notre guide complet : Comment ajouter Google Tag Manager à Shopify.