Qu'est-ce qu'un Web Pixel Shopify ? L'API de script de suivi moderne expliquée

Un Web Pixel est l'API officielle de Shopify pour exécuter des scripts de suivi et d'analyse sur vos pages de vitrine et de checkout. Introduit dans le cadre de la plateforme Checkout Extensibility de Shopify, les Web Pixels ont remplacé l'ancienne approche d'injection de scripts directement dans checkout.liquid ou le champ « Scripts additionnels » que Shopify a supprimé pour les boutiques sur Checkout Extensibility. La différence architecturale clé est que les Web Pixels s'exécutent dans un iframe sandboxé, ce qui signifie qu'ils ne peuvent pas accéder directement au DOM de la page principale, aux cookies ou au stockage local.

Il existe deux types de Web Pixels. Les App Pixels sont gérés par les applications Shopify — lorsque vous installez une application de suivi comme ScaleUp, elle enregistre un App Pixel que Shopify charge automatiquement sur toutes les pages, y compris le checkout. Les Custom Pixels sont des extraits JavaScript que vous écrivez et configurez manuellement via l'admin Shopify sous Paramètres > Événements clients. Les deux types reçoivent les mêmes événements e-commerce standardisés de Shopify (page_viewed, product_viewed, checkout_started, payment_info_submitted, checkout_completed, et d'autres) via l'API Web Pixel de Shopify.

Le passage aux Web Pixels représente un changement fondamental dans la façon dont Shopify gère le suivi tiers. Au lieu de donner aux scripts un accès complet à la page — ce qui créait des risques de sécurité, des problèmes de confidentialité et des problèmes de performance — Shopify agit désormais comme intermédiaire. Vos scripts de suivi reçoivent des données d'événements structurées de Shopify plutôt que de les extraire de la page. C'est plus fiable (plus de sélecteurs cassés lors des mises à jour de thème), plus privé (les scripts n'obtiennent que les données que Shopify choisit d'exposer), et plus sécurisé (les scripts sandboxés ne peuvent pas modifier l'expérience de checkout).

Les Web Pixels sont importants car ils sont désormais le seul moyen d'exécuter des scripts de suivi sur les pages de checkout Shopify pour les boutiques sur Checkout Extensibility. Shopify a déprécié checkout.liquid en août 2024 et a exigé que toutes les boutiques Shopify Plus migrent vers Checkout Extensibility début 2025. Les boutiques Shopify standard ont été migrées automatiquement. Si votre suivi Google Ads reposait sur des scripts dans checkout.liquid ou le champ Scripts additionnels, ces scripts ont cessé de fonctionner après la migration. Les Web Pixels sont le remplacement requis.

Pour le suivi Google Ads spécifiquement, la transition vers les Web Pixels affecte la façon dont les données de conversion sont capturées. L'ancienne approche consistant à placer un extrait gtag.js dans votre page de checkout et à lire les données de commande depuis le dataLayer ne fonctionne plus. Au lieu de cela, votre code de suivi (que ce soit via une application ou un pixel personnalisé) doit écouter l'événement standardisé checkout_completed de Shopify et extraire les données de conversion du payload de l'événement. Cela inclut le total de la commande, l'identifiant de transaction, la devise et les détails des lignes d'articles. La structure de l'événement est définie par Shopify, pas par votre thème ou code personnalisé, ce qui la rend plus cohérente mais signifie aussi que vous devez vous adapter au format de données de Shopify.

Le modèle sandbox impacte également le suivi basé sur les cookies. Parce que les Web Pixels s'exécutent dans un iframe, ils ne peuvent pas accéder directement aux cookies first-party définis sur votre domaine principal. Cela signifie que l'attribution traditionnelle basée sur les cookies (lecture du cookie _gcl_aw pour obtenir le GCLID) ne fonctionne pas dans un Web Pixel. Les applications de suivi doivent utiliser des méthodes alternatives — comme le passage des données d'attribution via le payload d'événement de Shopify, l'utilisation d'approches côté serveur, ou l'exploitation d'Enhanced Conversions — pour maintenir une attribution Google Ads précise. C'est un changement technique significatif qui prend de nombreux marchands au dépourvu lors de la migration.

Lorsqu'une page se charge sur votre boutique Shopify, la plateforme Shopify vérifie quels Web Pixels sont enregistrés pour votre boutique. Chaque pixel est chargé dans son propre iframe sandboxé — un contexte navigateur complètement isolé qui ne partage ni les cookies, ni le stockage local, ni l'accès au DOM avec la page principale. Shopify pousse ensuite les événements e-commerce standardisés dans l'iframe de chaque pixel via une API de messagerie. Par exemple, lorsqu'un client consulte un produit, Shopify déclenche un événement product_viewed contenant le titre du produit, le prix, l'ID de variante et d'autres données structurées. Votre code pixel reçoit cet événement et le traite comme vous en avez besoin — généralement en l'envoyant à Google Ads, GA4 ou une autre plateforme d'analyse.

Le flux d'événements continue tout au long du parcours client. Lorsqu'un client ajoute des articles au panier, commence le checkout, entre les informations de paiement et finalise l'achat, Shopify déclenche les événements correspondants (collection_viewed, product_added_to_cart, checkout_started, payment_info_submitted, checkout_completed) dans chaque pixel enregistré. L'événement checkout_completed contient les détails complets de la commande : identifiant de transaction, sous-total, taxes, livraison, codes de réduction appliqués, lignes d'articles avec quantités et prix, et l'e-mail du client (si le consentement est accordé). Ces données sont ce que votre code pixel utilise pour envoyer les événements de conversion à Google Ads.

Pour les App Pixels spécifiquement, le développeur de l'application (comme ScaleUp) écrit le code du pixel et l'enregistre via l'API Partenaires de Shopify. Lorsqu'un marchand installe l'application et active le suivi, Shopify commence à charger ce pixel sur chaque page. L'application peut également configurer quels événements clients elle souhaite recevoir et peut stocker des données de configuration qui sont transmises au pixel au chargement. Les Custom Pixels fonctionnent de manière similaire, mais le marchand écrit le JavaScript directement dans l'admin Shopify. Les deux types ont accès au même flux d'événements et aux mêmes contraintes de sandbox.

Le problème le plus significatif que les marchands rencontrent avec les Web Pixels est la perte des données d'attribution basées sur les cookies. Parce que les pixels s'exécutent dans un iframe sandboxé, ils ne peuvent pas lire les cookies first-party comme _gcl_aw (GCLID) ou _ga (ID client GA4) qui ont été définis sur le domaine principal. Si votre suivi repose sur la lecture de ces cookies au moment de la conversion, il sera défaillant dans un Web Pixel. C'est la raison principale pour laquelle de nombreuses boutiques Shopify voient une baisse des conversions attribuées après la migration vers Checkout Extensibility — la conversion se déclenche, mais le lien d'attribution au clic publicitaire initial est perdu.

Un autre problème courant est l'incomplétude des données d'événement dans les Custom Pixels. Bien que les événements standardisés de Shopify fournissent des données structurées, certains champs peuvent être vides selon la configuration de votre boutique, les choix de consentement du client et le flux de checkout spécifique. Par exemple, l'e-mail du client dans checkout_completed peut être masqué si le client n'a pas consenti au marketing. Les données de lignes d'articles peuvent utiliser des IDs de variante qui ne correspondent pas aux IDs de produit dans votre flux Google Merchant Center. Ces décalages nécessitent un mapping de données soigneux dans votre code pixel.

Les Web Pixels font partie de l'infrastructure de suivi plus large de Shopify. Comprendre ces concepts connexes vous aide à naviguer efficacement la transition vers le suivi Shopify moderne.