Stape
Rechercher
Essayer gratuitement

Balisage côté serveur pour Shopify

Mis à jour
12 nov. 2024
Publié
10 mars 2023
Egalement disponible

Êtes-vous à la recherche d'un moyen simple et rapide de configurer le balisage côté serveur Shopify ? Ne cherchez plus loin que l'application GTM du serveur Stape pour Shopify. Avec notre application, vous pouvez facilement insérer un script Web Google Tag Manager sur le site Web, configurer un domaine personnalisé et un chargeur personnalisé, envoyer des données d'événement utilisateur et de commerce électronique à la couche de données et configurer des webhooks. Toutes ces fonctionnalités vous aideront à rendre le suivi plus précis en prolongeant la durée de vie des cookies, en rendant le suivi du navigateur résistant aux technologies de prévention du suivi et en envoyant des données fiables aux plateformes de publicité et de marketing via le point de terminaison du serveur.

Dans cet article de blog, nous verrons comment configurer et installer l'application Stape pour Shopify afin que vous puissiez utiliser ces fonctionnalités puissantes tout de suite.

Avantages de l'utilisation du balisage côté serveur pour Shopify

Le balisage côté serveur peut booster le succès de vos campagnes marketing avec le suivi précis des conversions et  l’analyse des utilisateurs. Cependant, pour en tirer pleinement parti, il faut une configuration méticuleuse - quelque chose que personne ne devrait négliger.

Pour rendre la mise en œuvre du balisage côté serveur aussi simple que possible, nous avons créé une application Server GTM Shopify. Cette application est gratuite et permet de configurer facilement le conteneur du serveur Google Tag Manager pour la boutique Shopify. Mais d'abord, parlons des principaux avantages du balisage côté serveur pour les sites Shopify. 

 1. Meilleure précision des données : le balisage côté serveur peut aider à assurer une collecte de données plus précise en réduisant le risque de perte de données ou d'erreurs causées par les bloqueurs de publicités, les extensions de navigateur ou d'autres facteurs côté client.

2. Attribution précise des conversions. En raison de la durée de vie accrue des cookies et des données utilisateur envoyées via le serveur, les réseaux publicitaires peuvent attribuer plus précisément les conversions aux campagnes marketing.

3. Amélioration des performances du site Web. Avec le balisage côté serveur, les balises sont chargées sur le serveur plutôt que sur le côté client, ce qui réduit la quantité de code à charger sur le navigateur de l'utilisateur. Cela peut améliorer la vitesse de chargement du site Web, ce qui est important pour l'expérience utilisateur et le référencement.

4. Sécurité renforcée. Le balisage côté serveur peut aider à améliorer la sécurité du site Web en réduisant le risque de violation de données ou d'autres menaces de sécurité causées par des vulnérabilités côté client.

Fonctionnalités de l'application Stape Server GTM pour Shopify

Le but de l'application server GTM de Stape est de simplifier le processus de configuration du serveur Google Tag Manager et de fournir des données au serveur GTM. Notre application peut fonctionner avec l'hébergement stape.io pour le serveur Google Tag Manager ou avec n'importe quel autre, mais les fonctionnalités de chargeur personnalisé et de conservation des cookies du plug-in ne fonctionnent que lors de l'utilisation de l'hébergement stape.io.

1. Ajoutez le script Web Google Tag Manager sur chaque page du site Web.

Cochez la case Insérer un extrait GTM et ajoutez l'identifiant WEB Google Tag Manager. Une fois cela fait, l'application Stape insérera un script Web GTM dans chaque page du site Web.

Add web Google Tag Manager script onto every page of the website. 

2.  Ajoutez un domaine personnalisé.

La configuration d'un domaine personnalisé pour votre serveur de balisage est fortement recommandée car elle permet de configurer des cookies propriétaires. Lors de l'utilisation d'un domaine par défaut pour le serveur GTM, les plates-formes de suivi telles que Google Analytics définiront des cookies à partir du domaine google-analytics.com. Ce sont des cookies tiers. Dans les navigateurs avec Intelligent Tracking Prevention, comme Safari et Firefox, la durée de vie des cookies tiers peut être jusqu’à 7 jours maximum. Lorsque Google Analytics utilise un domaine personnalisé, il définit des cookies propriétaires, qui peuvent durer jusqu'à 2 ans.

Pour activer cette fonctionnalité, cochez la case et ajoutez un domaine personnalisé. Suivez ce guide pour trouver l'identifiant du conteneur Stape.

Add a custom domain

3. Ajoutez un chargeur personnalisé.

Le chargeur personnalisé est une fonctionnalité de Stape qui rend les scripts Google Tag Manager et Google Analytics invisibles pour les bloqueurs de publicités. Cela ne fonctionnera que si vous utilisez l'hébergement stape.io pour sGTM. Pour activer le chargeur personnalisé, cochez la case et ajoutez l'identifiant du conteneur Stape.

Add a custom loader

4. Ajoutez des événements de e-commerce et des données utilisateur à la couche de données.

data layer tab - shopify app by stape

Activation de la couche de données:

  • Activez la case à cocher «Add ecommerce Data Layer events».
  • Enregistrer les modifications.
  • Copiez le code du pixel personnalisé dans la case ci-dessous dans l'onglet couche de données et suivez les instructions pour l'ajouter et l'activer.

5. Envoyez le webhook au conteneur du serveur GTM. 

Note : le problème avec les webhooks sur Shopify est qu'ils ne contiennent pas de données de cookies qui sont cruciales pour le suivi de toute plateforme, donc l'utilisation d'événements webhook n'est recommandée qu'en dernier recours si, pour une raison ou une autre, vous ne pouvez pas le suivre en ligne.

C'est dans cet onglet que les événements webhook sont configurés.

webhook tab in shopify app by stape

Pour activer un webhook, vous devez activer la case à cocher, spécifier l'url du conteneur GTM du serveur et /path où les webhooks doivent être envoyés.

Vous pouvez vous abonner à des webhooks lorsqu'une nouvelle commande est créée ou lorsqu'un remboursement est effectué sur une commande.

Voici quelques articles de blog utiles sur l'utilisation et le débogage des webhooks :

Comment configurer le balisage côté serveur sur votre boutique Shopify

La configuration standard du balisage côté serveur est simple avec l'application Stape Server GTM pour Shopify. L'application vous aidera à implémenter un script gtm.js modifié dans la boutique Shopify, à envoyer des données à sGTM à l'aide de webhooks et à transmettre des poussées de couche de données au conteneur Web.

En utilisant l'hébergement Google Tag Manager du serveur stape.io, vous pouvez facilement configurer un serveur cloud pour le serveur Google Tag Manager. Nous proposons deux options d'hébergement sGTM : l'hébergement sGTM mondial et l'hébergement sGTM européen. L'hébergement sGTM européen convient aux utilisateurs qui ne peuvent pas transférer de données utilisateur en dehors de l'UE et ne peuvent pas utiliser Google Cloud pour utiliser le conteneur du serveur Google Tag Manager.

Voici les étapes de base requises pour configurer le balisage côté serveur pour Shopify :

3. Envoyez les données au conteneur du serveur Google Tag Manager. Il y a trois façons les plus populaires de le faire :

4. Configurez le suivi dans le conteneur du serveur Google Tag Manager. Les outils de marketing et d'analyse les plus populaires prennent déjà en charge le balisage côté serveur et disposent de balises pour sGTM. Vous pouvez trouver des guides sur notre site pour les mettre en œuvre, par exemple, Facebook CAPI, evenements TikTok API, SnapChat, suivi côté serveur Google Ads, etc. En outre, vous pouvez utiliser sGTM pour enrichir les données sGTM à l'aide de Firestoreou de Google Sheets. Une autre fonctionnalité utile de sGTM est l'envoi de conversions hors ligne vers Facebook et Adwords

5.  Installez l'application dans votre magasin.

Activer le module complémentaire dans Sales channels → Online Store → Votre sujet actif → bouton Customize → App embeds tab → activer Stape server GTM app et appuyez sur Save.

Debugging a GTM download

Après l'activation ou toute modification, il est recommandé de vérifier si votre conteneur est effectivement téléchargé sur le site.

Pour ce faire, allez sur n'importe quelle page de votre site, ouvrez la console de votre navigateur et, dans l'onglet réseau, entrez votre ID de conteneur sans la partie « GTM- ». Vous devriez voir une requête avec un statut de réponse 200 :

Debugging a GTM download

Debugging data layer checkout events

Avec les événements qui se produisent avant la page de paiement, tout fonctionne comme sur n'importe quelle autre plateforme - vous pouvez lancer un aperçu de votre conteneur web GTM et y trouver tous les événements que vous faites :

debugging data layer checkout events - stape

La seule option dans Shopify pour suivre les événements sur les pages de paiement est d'utiliser l'API Pixel de Shopify, de sorte que les événements de la couche de données et l'installation GTM sont mis en œuvre par ce biais dans notre application. 

Mais en raison de la façon dont il est techniquement mis en œuvre (tout le code de l'api pixel est rendu dans une iframe séparée), vous ne pouvez pas exécuter les prévisualisations GTM sur ces pages, bien que techniquement votre conteneur GTM s'y chargera.

Pour l'instant, vous ne pouvez donc pas déboguer vos événements de paiement en mode prévisualisation. Cette restriction s'applique également aux événements d'achat si vous utilisez Checkout Extensibility pour la page d'état de la commande.

La seule option pour déboguer les événements de caisse dans Shopify est de publier votre configuration ou vos changements sur vos conteneurs et de vérifier les demandes du réseau dans la console du navigateur.

De cette façon, vous pouvez vérifier si tous les événements que vous avez configurés disparaissent et s'ils contiennent toutes les données que vous avez configurées pour eux.

debugging checkout events in Shopify - stape

Pour faciliter la recherche des requêtes GTM, vous pouvez spécifier l'url ou une partie de l'url de votre conteneur de serveur dans le filtre.

Conclusion :

Les possibilités de balisage côté serveur se développent rapidement, offrant à l'utilisateur un excellent outil pour améliorer la précision du suivi et de l'analyse des conversions. En plus, Stape essaie de simplifier l'utilisation de sGTM pour nos clients, c'est pourquoi nous avons créé l'application Server GTM pour Shopify.

Server Stape GTM pour Shopify est un outil fantastique avec de nombreuses fonctionnalités et avantages. Par exemple, vous pouvez facilement configurer le suivi sur votre site Web en ajoutant un script Google Tag Manager et en configurant votre domaine et votre chargeur personnalisés. En plus, vous pouvez envoyer des données utilisateur à la couche de données et configurer des webhooks.

Toutes ces fonctionnalités contribuent à rendre les données analytiques plus précises en prolongeant la durée de vie des cookies et en rendant le suivi du navigateur résistant aux technologies de prévention du suivi. Ces outils sont essentiels pour une transmission fiable des données via le point de terminaison du serveur vers les plateformes de publicité et de marketing.

Si vous recherchez une solution simple et rapide pour configurer le balisage côté serveur Shopify, Stape c’est la meilleure solution. Profitez dès aujourd'hui de cette excellente opportunité et profitez des avantages d'informations de suivi plus précises avec l'application Stape Server GTM pour Shopify. Testez-le maintenant - nous sommes sûrs que vous ne serez pas déçu !

Tagged with:Shopify

Essayez Stape pour tout ce qui concerne le côté serveurmaintenant!