La rupture technique : Fin de checkout.liquid et nouveau paradigme
Pendant des années, les marchands Shopify ont personnalisé leur suivi de commande en modifiant le fichier checkout.liquid ou en collant des scripts JavaScript dans Paramètres > Paiement > Scripts supplémentaires. Cette pratique offrait un accès direct au DOM du navigateur, permettant d'injecter des balises marketing, des widgets d'avis et des outils tiers directement au cœur du tunnel d'achat.
Si cette approche était souple, elle ouvrait des failles critiques de cybersécurité (attaques Magecart de vol de coordonnées bancaires) et ralentissait considérablement le chargement du paiement. En réponse, Shopify a déployé Checkout Extensibility : une infrastructure moderne basée sur React, les Web Workers et une isolation sandbox rigoureuse.
L'Impact Immédiat sur Vos Campagnes
Avec l'abandon définitif de checkout.liquid et des scripts supplémentaires sur l'ensemble des forfaits Shopify, tout code JavaScript traditionnel situé dans le checkout cesse de fonctionner. Sans migration vers l'API Web Pixels, vos régies publicitaires ne reçoivent plus aucun signal d'achat final.
Ingénierie Checkout Shopify & CRO : Découvrez nos pôles Développement Shopify & Optimisation CRO et Web Pixels Server-Side, ou consultez l'Étude de Cas Olivia Garden (587 % de ROAS grâce à la récupération de 80 % des paiements).
Comprendre les limites du bac à sable de l'API Web Pixels
La contrainte majeure de Checkout Extensibility réside dans le fait que les balises de tracking ne s'exécutent plus dans la portée globale du navigateur. Elles sont isolées au sein d'un Web Worker en bac à sable hermétique.
Cette étanchéité technique impose des règles strictes qui rendent caduques les installations traditionnelles :
- Aucun accès à
windowoudocument: Les scripts ne peuvent ni lire les balises HTML de la page, ni intercepter arbitrairement les clics de souris. - Disparition du
dataLayerglobal : Il est impossible d'injecter le conteneur Google Tag Manager classique dans le bac à sable. - Restrictions sur les Cookies : Le bac à sable ne peut accéder directement aux cookies déposés sur votre domaine principal via
document.cookie.
Architecture de production : Pixel Personnalisé vers sGTM
Plutôt que d'installer des applications Shopify opaques qui enferment vos données, la méthode d'ingénierie recommandée consiste à déployer un Pixel Web Personnalisé dans Admin Shopify > Événements client.
Ce pixel souscrit aux événements natifs du parcours d'achat et transmet les données en HTTP POST directement à votre conteneur Google Tag Manager Côté Serveur (sGTM) :
Le Relais d'Événements en Sandbox
Dès qu'une commande est validée, Shopify déclenche l'événement système checkout_completed. Le Pixel Web extrait les montants de commande, les articles du panier et les données clients sécurisées, puis transmet immédiatement la charge JSON à https://collect.boutique.fr/shopify-events.
Correspondance des événements Shopify vers GA4 & Meta CAPI
Schéma de correspondance technique entre les événements Customer Events et les régies partenaires :
add_to_cart | Action Meta CAPI : AddToCartParamètres Clés :
value, currency, tableau d'articles items (item_id, price, quantity).
begin_checkout | Action Meta CAPI : InitiateCheckoutParamètres Clés :
value, currency, coupon, items, line_items_count.
add_payment_info | Action Meta CAPI : AddPaymentInfoParamètres Clés :
payment_type (ex. carte bancaire, apple_pay), value, currency.
purchase | Action Meta CAPI : PurchaseParamètres Clés :
transaction_id (Numéro de commande pour déduplication), tax, shipping, value, coordonnées client sécurisées (em, ph).
Transmission des identifiants GCLID & FBCLID dans la sandbox
L'une des anomalies les plus courantes post-migration est la disparition subite des identifiants de clic publicitaire (gclid, fbclid, ttclid). Le bac à sable ne pouvant lire les cookies racine, ces jetons doivent être injectés explicitement.
Nous mettons en place un pont de données en deux étapes :
- Capture sur la Boutique : Dès l'arrivée sur le site, les paramètres d'URL sont capturés et enregistrés dans les attributs du panier Shopify (cart attributes).
- Récupération en Sandbox : Au sein du Pixel Web Personnalisé, les attributs de panier sont lus et réinjectés dans la charge utile de l'événement
checkout_completedavant expédition vers le serveur sGTM.
Plan de migration pas à pas sans interruption
Le déploiement en production sur une boutique générant un volume d'affaires quotidien s'effectue en trois étapes :
Déploiement du Pixel Web Personnalisé
Création du code de pixel dans l'espace Événements client Shopify et validation des flux JSON vers le serveur sGTM de test à l'aide des outils de débogage.
Contrôle de Déduplication des Commandes
Vérification dans Meta Events Manager que les événements du pixel navigateur et ceux issus du serveur partagent le même event_id (numéro de commande) et sont fusionnés à 100%.
Publication du Profil Extensibility
Publication du nouveau profil de commande dans l'administration Shopify et suppression immédiate des anciens scripts dans la boîte Scripts supplémentaires.
Checklist d'audit post-migration
Dans les 24 heures suivant la mise en production, effectuez les contrôles suivants :
- Score EMQ Meta : Contrôlez que le score de qualité sur l'événement
Purchasese maintient au-dessus de 8,5/10. - Parité des Ventes GA4 : Vérifiez que le nombre de transactions remontées dans GA4 concorde à ±3% avec le total des commandes Shopify.
- Conversions Améliorées Google Ads : Assurez-vous que l'état de l'action de conversion affiche bien « Actif (Conversions améliorées détectées) ».
- Absence de Doublons : Confirmez qu'aucun chiffre d'affaires n'est comptabilisé en double sur vos tableaux de bord.
- Vitesse de Chargement du Checkout : Vérifiez que le temps de blocage processeur (TBT) reste sous les 100 millisecondes sur mobile.
Foire aux questions techniques
Quelle est l'échéance impérative pour abandonner checkout.liquid ?
Shopify a officiellement déprécié checkout.liquid. Les boutiques non migrées sont automatiquement basculées vers les modèles Extensibility par défaut, ce qui neutralise instantanément tous les scripts de suivi hébergés dans les anciennes sections de script.
Peut-on continuer à utiliser Google Tag Manager sur le checkout Shopify ?
Le script client gtm.js ne peut plus être directement inséré dans le DOM du paiement. En revanche, vous pouvez déployer un Pixel Web Personnalisé qui transmet les événements à un conteneur Google Tag Manager Côté Serveur (sGTM), conservant ainsi toute la flexibilité de vos déclencheurs sans compromettre la sécurité.
Faut-il être abonné à Shopify Plus pour utiliser Checkout Extensibility ?
Non. La personnalisation visuelle avancée de la page de paiement par glisser-déposer nécessite Shopify Plus, mais l'accès à l'API Web Pixels et au gestionnaire d'Événements Client est accessible sur l'ensemble des forfaits Shopify (Basic, Shopify, Advanced).
Comment les Web Pixels gèrent-ils le consentement RGPD et la CNIL ?
Shopify intègre nativement la gestion de la confidentialité (Customer Privacy API) avec les Web Pixels. Lors de la création du pixel, vous déclarez sa finalité (marketing ou analytics). Shopify bloque automatiquement l'émission des données si l'internaute n'a pas validé le bandeau de consentement.
Qu'advient-il des données lorsqu'un internaute utilise un bloqueur de pub ?
Les Web Pixels s'exécutant dans un Web Worker isolé et transmettant les flux vers votre propre sous-domaine d'entreprise (ex. collect.boutique.fr), les bloqueurs de publicité conventionnels ne parviennent pas à intercepter le flux, garantissant une captation proche de 100% des achats.
