Cette page du portail d'aide est obsolète et n'est plus activement maintenue par Emarsys.
Cette documentation n'est valable que pour la version 3.0 de Google Tag Manager, qui est obsolète. Elle ne s'applique pas à Google Analytics 4 (GA4).
Le but de ce document est de vous donner quelques lignes directrices générales et astuces pour l'implémentation des scripts d'API de collecte de données Emarsys sur votre site web, en utilisant votre configuration existante de Google Tag Manager (GTM).
Pour les spécifications et les exigences concernant cette implémentation, veuillez vous référer à la Documentation d'API JavaScript de collecte de données.
Vous aurez certainement besoin d'étendre votre implémentation GTM pour servir complètement nos scripts de collecte de données. Vous devrez déclarer de nouvelles variables et créer de nouvelles tâchez de balises qui demanderont des ressources IT professionnelles et une compréhension fine de comment votre site web est configuré.
Introduction
Google Tag Manager fournit un fragment de code unique, appelé code contenant, qui doit être implémenté sur le site web une seule fois. Une fois qu'il est implémenté, les utilisateurs peuvent ajouter divers fragments de code et balises de prestataire tiers en utilisant une interface utilisateur simple à https://tagmanager.google.com/.
Toutefois, même en utilisant un système de gestion des balises, l'implémentation de fonctions plus complexe demande souvent un codage supplémentaire.
Ce codage implique de créer ou d'étendre la "couche de données". La couche de données est une méta-structure qui standardise les formats de données et donne à GTM une base de données supplémentaire à utiliser pendant le déploiement de balises avancées telles que celles que vous utiliserez pour la collecte de données.
Exigences de la couche de données GTM générique
Par défaut, GTM ne voit que les données (variables présentes sur la page web. Il est de notoriété publique que GTM peut avoir des difficultés à capturer correctement certaines de ces variables : le formatage de texte spécial (par ex. les valeurs de prix seront formatées avec un formatage de devises et de chiffres différent) peut rendre la lecture des données difficile et certaines données peuvent aussi ne pas être présentes sur chaque page par défaut (par exemple, nous exigeons que le site web rapporte les contenus de panier sur chaque page, même là où le contenu d'un panier n'est pas listé par la page web par défaut).
La solution à ces difficultés est de transmettre de telles données à GTM en les ajoutant à la couche de données.
Techniquement la couche de données est un objet JavaScript tableau contenant des paires de valeurs-clé :
var dataLayer = dataLayer || []; dataLayer.push({ visitorId : 345, visitorEmail : john@doe.tld , });Vous pouvez en lire plus sur la couche de données et où et comment elle doit être placée dans le code source de votre site web dans la documentation Google Tag Manager détaillée.
Pour une liste complète des données requises pour votre intégration, veuillez voir le tableau récapitulatif ci-dessous.
Lignes directrices pour intégrer l'API JavaScript
De manière générale, il est fortement recommandé aux responsables de site web d'implémenter la Couche de données Enhanced Ecommerce pour Google Tag Manager. Bien que cela implique un effort de codage initial plus long, le résultat est de permettre aux utilisateurs GTM de transmettre des données produits spécifiques à plusieurs prestataires de balises, y-compris Emarsys.
Dans ce guide nous supposons que l'implémentation Enhanced Ecommerce est prête à être utilisée et que les codes nécessaires sont placés au-dessus du fragment de code contenant de GTM, comme recommandé par Google. Dans tout autre cas spécial, vous devrez ajuster les déclencheurs et les paramètres en fonction de votre fonctionnalité de site web spécifique.
Veuillez aussi noter qu'Emarsys ne peut pas vous fournir de guide détaillé pour tous les scénarios possible de structure de site web. Si vous avez des questions spécifiques, vous devez contacter votre support d'agence ou un Partenaire Google Analytics Certifié.**
Créer des variables et des balises contenant le JavaScript Emarsys
Pour prendre en charge tous les éléments nécessaires de votre intégration, vous devez d'abord créer plusieurs variables GTM :
- ecommerce Une variable de couche de données qui lira vos données Enhanced Ecommerce. Ce sera la source dans vos autres variables et balises pour transmettre des données produits à Emarsys :
2. Chemin de catégorie Vous devrez inclure la catégorie actuellement consultée par le visiteur dans la couche de données ; ceci doit être lu dans une variable GTM.
La valeur de catégorie transmise à la commande JavaScript de catégorie doit correspondre exactement aux valeurs de catégorie incluses dans le catalogue produit :
3. Contenu du panier Comme mentionné plus haut, Enhanced Ecommerce n'inclut pas les contenus du panier sur toutes les pages, mais ceci est exigé par Emarsys. Vous devrez donc l'ajouter vous-même dans la déclaration de couche de données initiales dans le balise <head>. Aucune convention de désignation recommandée ne s'applique ici. Assurez-vous juste d'inclure tout ce dont la commande cart a besoin (par exemple la quantité d'articles ainsi que le prix total).
Vous pourrez ensuite lire la couche de données en utilisant une variable GTM et ajouter ceci à la commande cart. La commande cart peut être incluses dans votre balise Emarsys générale décrite ci-dessous.
Créer la balise Emarsys.
Une fois les variables configurées, vous devrez créer une nouvelle balise de type HTML personnalisé. Nous l'appellerons la balise Emarsys.
Cette balise Emarsys inclura du code JavaScript (utilisez l'exemple JSFiddle lié pour créer votre propre code) contenant toutes les commandes requises par l'API de collecte de données.
Comme vous pouvez voir dans le JSFiddle, le code charge d'abord l'API de collecte de données lui-même. Ceci doit référencer votre ID marchand, tel que délivré par Emarsys.
Ensuite, le code vérifie le type de page sur lequel nous sommes actuellement.
Une fois ceci déterminé, il est aisé d'utiliser votre implémentation enhanced e-commerce existante et d'appeler les commandes de collecte de données correctes à partir de la balise : view ou category ou purchase
Utilisez le code exemple JSFiddle pour créer votre propre implémentation de balise :
Identification de l'utilisateur
Les conditions d'utilisation de GTM interdisent l'usage d'informations personnelles à l'intérieur des balises Google. Vous pouvez néanmoins ajouter des informations de ce type dans la couche de données, mais devez alors vous assurer qu'elles ne soient transmises à aucune balise Google, y-compris vos balises Google Analytics. Vous pouvez toutefois les transmettre à tout prestataire tiers, tel qu'Emarsys, pour vous assurer que le traçage des clients fonctionne comme prévu.
L'API de collecte des données offre deux méthodes pour transmettre des données de client connecté :
- Fournir l'ID de votre utilisateur dans votre base de données utilisateur.
- Fournir l'adresse email de cet utilisateur.
Remarque : Nous conseillons d'utiliser l'adresse email, puisqu'alors vous n'avez pas à entretenir d'ID externe. Dans tous les cas, vous devrez l'ajouter comme clé dans votre couche de données initiale ajoutée à la section <head> de votre site web.
Vous devrez créer une nouvelle variable GTM dans votre contenant GTM qui charge ces données à partir de votre couche de données. Nous prendrons une variable GTM appelée Email utilisateur pour exemple. Vous pouvez modifier votre balise Emarsys générale évoquée plus haut pour qu'elle inclue aussi la commande JavaScript qui règle l'email utilisateur à l'aide de ce nom de variable Email utilisateur :
ScarabQueue.push(['setEmail', {{User Email}} ]);Tableau récapitulatif des données requises pour l'implémentation
Les types de données que vous devez rendre accessible au JavaScript Emarsys sont :
| Type de données | Description | Commande JavaScript | Source GTM |
|---|---|---|---|
| Identifiant utilisateur | Soit votre propre userID interne, soit l'adresse email de l'utilisateur. | setEmail / setCustomerId | Ajoutez à la couche de données initiale, par ex. Email utilisateur. |
| Identifiant produit | L'identifiant unique utilisé pour identifier les produits, tel qu'enregistré dans votre Google Product Feed ou fichier .csv de catalogue produit Emarsys. | view, cart, purchase | Enhanced Ecommerce. Concernant la commande cart , vous devez l'ajouter en tant qu'élément de couche de données distinct sur toutes les pages de votre site web. |
| Chemin de catégorie | Le chemin de catégorie visité, tel qu'enregistré dans votre Google Product Feed ou fichier .csv de catalogue produit Emarsys. | category | Ajoutez à la couche de données initiale. |
| Quantité de produit | Quand un produit est ajouté à un panier ou acheté. | cart, purchase | Enhanced Ecommerce. Concernant la commande cart , vous devez l'ajouter en tant qu'élément de couche de données distinct sur toutes les pages de votre site web. |
| Prix total du produit | Quand un produit est ajouté à un panier ou acheté (en tenant compte de la quantité et de toutes les réductions) | cart, purchase | Enhanced Ecommerce. Concernant la commande cart , vous devez l'ajouter en tant qu'élément de couche de données distinct sur toutes les pages de votre site web. |