Comment configurer Google Tag Manager sur Shopify (guide 2026)

Si vous avez suivi un tutoriel Google Tag Manager écrit avant 2025, la moitié de ce que vous avez fait sur votre checkout Shopify est discrètement cassée aujourd'hui. Le fichier checkout.liquid n'existe plus. Le champ « Scripts supplémentaires » sous Paramètres > Paiement n'existe plus. Les marchands Shopify Plus ont perdu ce flux le 28 août 2025, et les marchands non-Plus le 26 août 2026. Si votre configuration GTM actuelle repose sur l'un ou l'autre, vos événements d'achat ne se déclenchent pas.

Ceci est un guide de reconstruction. Nous allons configurer Google Tag Manager sur Shopify comme cela fonctionne réellement en 2026 : une installation pour la boutique, une pour le checkout, et un vrai test pour prouver que les deux sont vivantes.

Pourquoi Shopify rend GTM plus compliqué qu'il ne devrait l'être

Voyez votre boutique Shopify comme deux bâtiments reliés.

La boutique est le premier bâtiment. Pages produit, collections, panier, articles de blog. Ce bâtiment est le vôtre. Vous pouvez y mettre GTM en éditant le code de votre theme.

Le checkout est le second bâtiment. Shopify le fait tourner dans un environnement sandbox pour des raisons de sécurité. Le code de votre theme ne peut pas l'atteindre. Le conteneur GTM que vous installez dans la boutique n'est tout simplement pas chargé quand un acheteur arrive sur le checkout, le paiement ou la page de remerciement.

Avant 2025, on contournait cela en collant un second snippet GTM dans checkout.liquid ou dans le champ « Scripts supplémentaires ». Ces deux portes sont désormais fermées. Le remplaçant 2026 s'appelle Custom Pixels, géré sous Paramètres > Événements clients. Les Custom Pixels tournent dans une iframe sandboxée et communiquent avec le reste de votre stack de tracking via postMessage.

En pratique, une configuration GTM Shopify complète en 2026 compte deux installations, pas une :

1. Conteneur GTM standard dans theme.liquid pour la boutique.
2. Custom Pixel sous Événements clients pour le checkout et la page de remerciement.

Sautez l'une des deux moitiés et vos données paraîtront fausses d'une manière que vous ne remarquerez pas avant des semaines.

Ce dont vous avez besoin avant de toucher à quoi que ce soit

• Un accès admin Shopify avec les permissions pour éditer les themes et gérer les Événements clients.
• Un compte Google Tag Manager. Si vous n'en avez pas, connectez-vous sur tagmanager.google.com et créez un conteneur. Choisissez « Web » comme plateforme cible et utilisez l'URL de votre boutique comme nom de conteneur.
• Une propriété GA4 déjà configurée dans Google Analytics. Récupérez l'identifiant de mesure (il commence par G-). Sans GA4 en place, aucun des tags ci-dessous n'aura de sens.
• L'extension navigateur Google Tag Assistant. Vous l'utiliserez pour vérifier l'installation.
• Une commande de test que vous pouvez réellement passer. Utilisez un vrai moyen de paiement avec un code de réduction, puis remboursez. Le mode Preview ne suffit pas pour le suivi du checkout en 2026.

Tout ce qui suit suppose que vous êtes sur Online Store 2.0 avec un theme moderne comme Dawn, ou n'importe quel theme bâti sur la même structure.

Partie 1 : installer GTM sur votre boutique Shopify

Cela couvre toutes les pages sauf le checkout : accueil, pages de collection, pages produit, panier, blog, pages statiques.

Étape 1 : récupérer vos snippets GTM

Dans votre conteneur GTM, cliquez sur l'identifiant du conteneur en haut (il ressemble à GTM-XXXXXXX). GTM vous affiche deux blocs de code. Copiez les deux. Le premier va dans <head>, le second juste après <body>.

Étape 2 : dupliquer votre theme avant d'éditer

Ne modifiez jamais directement votre theme publié. Dans votre admin Shopify, allez dans Boutique en ligne > Themes. Trouvez votre theme en ligne, cliquez sur les trois points et choisissez Dupliquer. Éditez la copie. Si quelque chose casse, vous gardez une version fonctionnelle de secours.

Étape 3 : ouvrir theme.liquid

Sur le theme dupliqué, cliquez sur Actions > Modifier le code. Dans le panneau de gauche sous Layout, ouvrez theme.liquid. C'est le template qui enveloppe chaque page de la boutique.

Étape 4 : coller le snippet du head

Trouvez la balise ouvrante <head> en haut du fichier. Collez le premier snippet GTM juste après, le plus haut possible pour qu'il se déclenche tôt.

<head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->

Remplacez GTM-XXXXXXX par votre identifiant de conteneur réel.

Étape 5 : coller le snippet du body

Descendez jusqu'à la balise ouvrante <body>. Collez le second snippet GTM immédiatement après. Si votre theme contient un bloc if browser.supports_no_js près de la balise body, collez le snippet GTM au-dessus de ce bloc.

<body>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Étape 6 : enregistrer, prévisualiser et publier

Enregistrez le fichier. Prévisualisez le theme dupliqué. Ouvrez l'extension Tag Assistant, connectez-vous à l'URL de votre boutique et confirmez que le conteneur se charge. Une fois que le conteneur se déclenche proprement sur une page produit, publiez le theme.

Le GTM de la boutique est maintenant en ligne. Tout ce qui précède le checkout est traquable. Passons à la moitié la plus difficile.

Partie 2 : suivre le checkout et les achats avec un Custom Pixel

C'est là que la plupart des boutiques Shopify perdent des données. Le Custom Pixel est le seul moyen supporté de déclencher des tags sur le checkout et la page de remerciement en 2026.

Étape 1 : ouvrir les Événements clients

Dans votre admin Shopify, allez dans Paramètres > Événements clients. Cliquez sur Ajouter un pixel personnalisé, donnez-lui un nom comme « GTM Checkout Pixel », et ouvrez l'éditeur.

Étape 2 : coller le code du pixel

Voici un point de départ fonctionnel. Il charge GTM dans le sandbox du pixel et s'abonne aux événements de checkout natifs de Shopify, en les poussant dans un dataLayer que votre conteneur GTM peut récupérer.

// Load GTM inside the Custom Pixel sandbox
(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');

// Purchase event
analytics.subscribe("checkout_completed", (event) => {
  const checkout = event.data.checkout;
  window.dataLayer.push({
    event: "purchase",
    ecommerce: {
      transaction_id: checkout.order.id,
      value: checkout.totalPrice.amount,
      currency: checkout.currencyCode,
      tax: checkout.totalTax?.amount || 0,
      shipping: checkout.shippingLine?.price?.amount || 0,
      items: checkout.lineItems.map(item => ({
        item_id: item.variant.product.id,
        item_name: item.title,
        price: item.variant.price.amount,
        quantity: item.quantity
      }))
    }
  });
});

// Begin checkout event
analytics.subscribe("checkout_started", (event) => {
  const checkout = event.data.checkout;
  window.dataLayer.push({
    event: "begin_checkout",
    ecommerce: {
      value: checkout.totalPrice.amount,
      currency: checkout.currencyCode,
      items: checkout.lineItems.map(item => ({
        item_id: item.variant.product.id,
        item_name: item.title,
        price: item.variant.price.amount,
        quantity: item.quantity
      }))
    }
  });
});

Remplacez GTM-XXXXXXX par votre identifiant de conteneur. Enregistrez le pixel. Définissez les permissions de confidentialité client selon votre stratégie de consentement, puis connectez le pixel. Shopify n'activera pas le pixel tant qu'il n'est pas connecté.

Étape 3 : confirmer que la page de remerciement est publiée

Il existe un réglage Shopify discret qui casse beaucoup de suivis d'achat. Allez dans Paramètres > Paiement et confirmez que les pages de remerciement et de statut de commande sont publiées sous la nouvelle extensibilité du checkout. Si elles ne le sont pas, votre Custom Pixel n'a aucune page sur laquelle se déclencher et l'événement d'achat est silencieusement perdu.

Partie 3 : configurer votre premier tag GA4 dans GTM

GTM est maintenant chargé à deux endroits. Il est temps de déclencher un vrai tag.

Dans GTM :

1. Tags > Nouveau > Google Analytics : configuration GA4. Saisissez votre identifiant de mesure. Déclencheur : All Pages. Enregistrez.
2. Tags > Nouveau > Événement GA4. Nom de l'événement : purchase. Tag de configuration : le tag GA4 que vous venez de créer. Déclencheur : Événement personnalisé avec le nom d'événement purchase. Sous Ecommerce, cochez Envoyer les données e-commerce et définissez la source sur Data Layer. Enregistrez.
3. Soumettez le conteneur. Les modifications GTM ne passent pas en ligne tant que vous n'avez pas cliqué sur Soumettre et publié une version.

Répétez le même schéma pour begin_checkout, add_to_cart, view_item et tout autre événement qui vous intéresse.

Comment tout tester sans deviner

C'est là que la plupart des boutiques s'arrêtent, et là que la plupart des bugs de tracking commencent. Ne sautez pas cette étape.

1. Mode Preview de GTM. Activez Preview dans GTM, connectez-vous à l'URL de votre boutique en ligne et naviguez sur le site comme un acheteur. Chaque tag attendu doit se déclencher sur la bonne page.
2. Débogage du Custom Pixel. Ouvrez votre boutique dans Chrome, ouvrez les DevTools et allez dans la Console. Tapez Shopify.designMode et confirmez que vous êtes dans le contexte de la boutique. Les Custom Pixels tournent dans un sandbox Lax, donc basculez le menu de contexte de la console sur Lax pour voir les logs du pixel.
3. Vraie commande de test. Passez une commande de test complète, de bout en bout. Appliquez une réduction à 0,01 $ ou remboursez ensuite. Ne vous fiez pas à l'aperçu de commande.
4. GA4 DebugView. Ouvrez GA4 > Configurer > DebugView pendant que vous passez la commande de test. Confirmez qu'un seul événement purchase arrive, avec un transaction_id unique.
5. Onglet Réseau. Dans les DevTools, filtrez sur les requêtes collect. Vous devez voir une seule requête collect pour l'achat, pas deux. Les doublons signifient presque toujours que le suivi natif de l'application Google & YouTube et votre suivi GTM se déclenchent en même temps.

Erreurs courantes qui ruinent les données

• Double déclenchement des événements d'achat. Si l'application Google & YouTube de Shopify est installée et configurée pour GA4, et que vous envoyez aussi GA4 via GTM, chaque achat est compté deux fois. Choisissez une seule voie. Si vous voulez la souplesse de GTM, désactivez GA4 dans l'application Google & YouTube.
• Éditer le theme en ligne. Une faute de frappe dans theme.liquid et toute votre boutique peut devenir blanche. Dupliquez toujours.
• Oublier de connecter le Custom Pixel. Le pixel ne fait rien tant que vous n'avez pas cliqué sur Connecter. Enregistré ne veut pas dire en ligne.
• Gestion du consentement absente. Si vous servez du trafic UE ou britannique, votre Custom Pixel et vos tags GTM doivent respecter l'état du consentement. Configurez les permissions du pixel et utilisez Consent Mode v2 dans GTM.
• Croire que le mode Preview couvre le checkout. Le mode Preview de GTM ne tourne pas dans le sandbox du Custom Pixel. Vous devez passer une vraie commande pour vérifier les tags du checkout.
• Ignorer l'identifiant de transaction. Si transaction_id est absent ou instable, GA4 surcomptera les achats dès qu'un acheteur rafraîchit la page de remerciement.

Quand passer au tagging côté serveur

Le GTM côté client en 2026 perd une part croissante d'événements à cause des bloqueurs de publicité, de l'ITP de Safari, des réglages de confidentialité par défaut sur iOS et des refus de consentement. Si votre boutique fait plus d'environ 100 000 $ de chiffre d'affaires par mois, ou si vos campagnes payantes dépendent fortement de la précision des conversions, le GTM côté serveur devient une option sérieuse.

Le tagging côté serveur déplace la collecte de données hors du navigateur de l'acheteur, vers un conteneur que vous contrôlez sur votre propre sous-domaine. Vous obtiendrez une attribution plus propre, des pages plus rapides, et de meilleurs taux de correspondance pour Meta CAPI et les conversions Google Ads. Ce n'est pas une configuration pour débutant, mais c'est là que finit toute marque Shopify sérieuse sur le tracking.

Quand confier cela à un expert

Configurer GTM fait partie de ces tâches qui ressemblent à une checklist et se transforment en marécage. Vous collez un snippet, vous passez une commande de test, les achats n'apparaissent toujours pas, GA4 remonte des chiffres bizarres, et vous voilà à déboguer des sandbox de pixels un vendredi soir.

Si vous préférez ne pas le faire vous-même, nous gérons la configuration analytics Shopify de bout en bout, de GTM à GA4 en passant par Meta CAPI et le côté serveur. Voyez à quoi ressemble une configuration complète de tracking et d'analytics Shopify faite par quelqu'un qui en fait toutes les semaines.

Questions fréquentes

Dois-je être sur Shopify Plus pour installer Google Tag Manager ?

Non. GTM sur la boutique fonctionne sur tous les forfaits Shopify. Les Custom Pixels pour le suivi du checkout sont également disponibles sur tous les forfaits depuis 2026.

Puis-je encore utiliser checkout.liquid pour GTM ?

Non. checkout.liquid a été déprécié pour Shopify Plus le 28 août 2025, et pour les boutiques non-Plus le 26 août 2026. Utilisez les Custom Pixels à la place.

GTM va-t-il ralentir ma boutique Shopify ?

Chargé correctement dans <head> avec async, GTM ajoute quelques kilo-octets et ne bloque pas le rendu. En revanche, une configuration de tags surchargée dans GTM peut ralentir les choses. Gardez vos tags légers et utilisez des déclencheurs ciblés, pas « All Pages » pour tout.

Ai-je besoin de GTM si j'utilise déjà l'application Google & YouTube ?

L'application suffit si vous ne vous souciez que de Google Ads et d'un reporting GA4 basique. Utilisez GTM quand vous avez besoin de plusieurs pixels (Meta, TikTok, Pinterest, Klaviyo), d'événements personnalisés ou de tagging côté serveur.

Comment tester le suivi des achats sans vraie commande ?

Vous ne pouvez pas le tester complètement sans commande. Le mode Preview de GTM ne tourne pas dans le sandbox du Custom Pixel. Passez une petite commande réelle, vérifiez dans GA4 DebugView, puis remboursez.

Où placer GTM sur une boutique Shopify headless ?

Sur une configuration headless, vous injectez GTM au niveau du framework (Next.js, Hydrogen, Nuxt) dans votre layout racine, et vous avez toujours besoin du Custom Pixel pour le checkout, puisque celui-ci reste sur le domaine de Shopify.