1. Avantages de l'utilisation de Google Tag Manager

Suivi Simplifié

Changements de code minimes après l'installation initiale de GTM
Configuration et modification rapides des balises de suivi (via GTM)
Dépendance réduite vis-à-vis des développeurs
Interface visuelle pour la gestion des balises

Contrôle Centralisé

Plateforme unique pour toutes les balises de suivi
Contrôle de version et historique des modifications
Mises à jour faciles sur l'ensemble du site web
Implémentation cohérente sur toutes les pages
Fonctionnalités de collaboration en équipe

Avantages Supplémentaires

Vitesse : Implémentation plus rapide des balises marketing
Test : Mode de prévisualisation et de débogage intégré
Sécurité : Risque réduit d'erreurs de code
Flexibilité : Intégration facile avec de multiples plateformes
Conformité : Meilleur contrôle sur la collecte de données

2. Prérequis

Avant de commencer, assurez-vous d'avoir :

Un conteneur Web Google Tag Manager (ou la permission d'en créer/éditer un)
Une propriété GA4 et votre Measurement ID (format : G-XXXXXXXXXX)
Accès au code de votre site web/CMS pour installer GTM sur toutes les pages
(Recommandé) Une bannière de consentement / configuration du Consent Mode si vous opérez dans des régions réglementées

3. Aperçu du Processus de Suivi

Architecture du Flux de Données

Action Client : L'utilisateur interagit avec le widget Smeetz
Génération d'Événement : Objet E-commerce créé dans le flux de réservation
Transmission de Données : Objet envoyé à votre site web
Data Layer : Objets mis en file d'attente dans le dataLayer de GTM
Traitement des Balises : GTM traite et transmet aux destinations

4. Événements Suivis

Les événements ci-dessous correspondent au format dataLayer Smeetz que Smeetz envoie au Google Tag Manager (GTM) de votre site web. Ce format n'est pas le même que le format d'événement/payload natif attendu par des plateformes comme Google Analytics 4 (GA4) ou Meta.

En pratique, vous utilisez GTM pour lire ces événements Smeetz (lorsqu'ils arrivent dans le dataLayer), puis mapper/transformer les données dans la structure attendue par la plateforme de destination et enfin les envoyer à GA4, Meta ou tout autre outil que vous utilisez.

Important : Certains événements peuvent contenir des informations personnellement identifiables (PII) (par exemple smtz_user_identity peut inclure une adresse email). Ne transmettez pas de PII en texte clair à GA4 (les politiques de GA interdisent l'envoi de PII). Utilisez GTM pour soit (a) éviter d'envoyer ces champs à GA4, soit (b) hacher/transformer les données uniquement là où votre plateforme de destination et la base légale le permettent.

widget-button-click

Quand il se déclenche : Lorsque l'utilisateur clique sur le bouton du widget (bouton Réserver) pour ouvrir l'iframe de réservation.
Ce que vous recevez : Un payload minimal contenant seulement l'événement.

JSON

{
	"event": "widget-button-click"
}

smtz_user_identity

Quand il se déclenche : Lorsqu'un utilisateur est identifié dans le flux. Cela peut se produire (1) juste après qu'un utilisateur se connecte ou s'inscrit, (2) immédiatement à l'ouverture du widget si l'utilisateur est déjà connecté (session mémorisée), et (3) à nouveau plus tard dans le flux (il peut être émis plus d'une fois, par exemple près de la confirmation finale où smtz_purchase est envoyé).
Ce que vous recevez : Un payload d'identité utilisateur dans smeetzData. Au minimum, cela inclut email, et peut aussi inclure firstname/lastname lorsqu'ils sont disponibles. Traitez ce payload comme des PII et ne transmettez que ce dont vous avez besoin.

JSON

{
	"event": "smtz_user_identity",
	"smeetzLabel": "<user_email>",
	"smeetzCategory": "user_identity",
	"smeetzAction": "Identify user",
	"smeetzData": {
		"email": "<user_email>",
		"firstname": "<first_name>",
		"lastname": "<last_name>"
	}
}

smtz_view_item_list

Quand il se déclenche : Lorsque l'utilisateur atteint la liste des billets (première fois qu'il voit les articles/billets disponibles pour un produit).
Ce que vous recevez : Le produit/article vu dans smeetzData (sous forme de tableau d'articles) pour supporter le suivi view_item_list de GA4.

JSON

{
	"event": "smtz_view_item_list",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "view Item List",
	"smeetzData": [
		{
			"id": "<product_id>",
			"name": "<product_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"quantity": 1
		}
	]
}

smtz_dynamicPricing_enabled

Quand il se déclenche : Lorsque la tarification dynamique est activée pour l'utilisateur/produit actuel (cela peut être envoyé avant les événements e-commerce normaux pour signaler la session).
Ce que vous recevez : Un événement de type "drapeau" (flag) utilisant la même structure e-commerce afin que vous puissiez segmenter ou enrichir le suivi en aval dans GTM.

JSON

{
	"event": "smtz_dynamicPricing_enabled",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "view Item List",
	"smeetzData": [
		{
			"id": "<product_id>",
			"name": "<product_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"quantity": 1
		}
	]
}

smtz_remove_from_cart

Quand il se déclenche : Lorsque l'utilisateur retire un billet/article du panier.
Ce que vous recevez : L'article retiré dans smeetzData (sous forme de tableau d'articles).

JSON

{
	"event": "smtz_remove_from_cart",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "Remove From Cart",
	"smeetzData": [
		{
			"id": "<ticket_name>",
			"name": "<product_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"price": 0,
			"quantity": 1
		}
	]
}

smtz_view_cart

Quand il se déclenche : Lorsque l'utilisateur ouvre/voit l'écran du panier.
Ce que vous recevez : Le contenu actuel du panier dans smeetzData (sous forme de tableau d'articles).

JSON

{
	"event": "smtz_view_cart",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "View Cart",
	"smeetzData": [
		{
			"id": "<item_id>",
			"name": "<ticket_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"category": "<ticket_name>",
			"price": 0,
			"quantity": 1
		}
	]
}

smtz_add_to_cart

Quand il se déclenche : Lorsque le client ajoute un billet/article au panier.
Ce que vous recevez : L'article ajouté dans smeetzData (sous forme de tableau d'articles) et un transactionId (référence de réservation).

JSON

{
	"event": "smtz_add_to_cart",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "Add to cart",
	"transactionId": "<booking_ref>",   
	"smeetzData": [
		{
			"id": "<ticket_id>",
			"name": "<ticket_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"price": 0,
			"quantity": 1,
			"discount": 0
		}
	]
}

smtz_begin_checkout

Quand il se déclenche : Lorsque le client commence le processus de commande (passe du panier au checkout).
Ce que vous recevez : Les articles actuels du panier dans smeetzData (sous forme de tableau d'articles) et un transactionId (référence de réservation).

JSON

{
	"event": "smtz_begin_checkout",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "Begin Checkout",
	"transactionId": "<booking_ref>",
	"smeetzData": [
		{
			"id": "<item_id>",
			"name": "<ticket_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"category": "<ticket_name>",
			"price": 0,
			"quantity": 1,
			"discount": 0
		}
	]
}

smtz_checkout_progress

Quand il se déclenche : Lorsque le client avance dans les étapes de commande (progression dans le flux de checkout).
Ce que vous recevez : Les articles actuels de la commande dans smeetzData (sous forme de tableau d'articles) et un transactionId (référence de réservation).

JSON

{
	"event": "smtz_checkout_progress",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "Checkout progress",
	"transactionId": "<booking_ref>",
	"smeetzData": [
		{
			"id": "<item_id>",
			"name": "<ticket_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"category": "<ticket_name>",
			"price": 0,
			"quantity": 1,
			"discount": 0
		}
	]
}

smtz_payment_info

Quand il se déclenche : Lorsque le client atteint/soumet les informations de paiement durant le checkout.
Ce que vous recevez : Les articles actuels de la commande dans smeetzData (sous forme de tableau d'articles), un transactionId (référence de réservation), et une value représentant le total de la réservation à cette étape.

JSON

{
	"event": "smtz_payment_info",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "Add payment Info",
	"transactionId": "<booking_ref>",
	"smeetzData": [
		{
			"id": "<item_id>",
			"name": "<ticket_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"category": "<ticket_name>",
			"price": 0,
			"quantity": 1,
			"discount": 0
		}
	],
	"value": 0
}

smtz_purchase

Quand il se déclenche : Lorsque la réservation est complétée avec succès (achat/confirmation).
Ce que vous recevez : Les articles achetés dans smeetzData (sous forme de tableau d'articles), un transactionId (référence de réservation), et une value représentant le total. Cet événement peut également inclure des champs client qui sont déjà hachés (SHA-256) tels que customerEmail, customerFirstName, customerLastName, et customerPhoneNumber.

JSON

{
	"event": "smtz_purchase",
	"smeetzLabel": "<product_name>",
	"smeetzCategory": "ecommerce",
	"smeetzAction": "Purchase",
	"smeetzData": [
		{
			"id": "<item_id>",
			"name": "<ticket_name>",
			"currency": "<currency>",
			"brand": "<brand>",
			"price": 0,
			"quantity": 1,
			"category": "<ticket_name>",
			"discount": 0
		}
	],
	"transactionId": "<booking_ref>",
	"value": 0,
	"customerEmail": "<sha256_email_hex>",
	"customerFirstName": "<sha256_first_name_hex>",
	"customerLastName": "<sha256_last_name_hex>",
	"customerPhoneNumber": "<sha256_phone_hex>"
}

5. Étapes d'Implémentation

Étape 1 : Installer le snippet GTM sur votre site web (requis)

Cette étape est requise pour que GTM puisse recevoir et traiter les événements dataLayer.

Dans Google Tag Manager, allez dans Admin → Installer Google Tag Manager (ou cliquez sur votre ID de conteneur en haut).
Copiez les deux snippets affichés par GTM :
- Script snippet : collez-le dans la section <head>.
- NoScript snippet : collez-le immédiatement après la balise d'ouverture <body>.
Installez les snippets sur toutes les pages où le widget peut être utilisé (y compris les sous-domaines si applicable).
Vérifiez l'installation : Ouvrez votre site web et utilisez le mode Tag Assistant / Preview dans GTM. Confirmez que le conteneur se charge et que vous voyez les événements dataLayer arriver.

Note : Ne réécrivez pas le snippet manuellement. Copiez-le toujours depuis l'interface GTM pour éviter les fautes de frappe.

Étape 2 : Insérer l'ID GTM dans le Back Office Smeetz

Connectez-vous au back office Smeetz
Naviguez vers la section Intégrations
Localisez le champ GTM/Google Tag Manager
Entrez votre ID de Conteneur GTM (format : GTM-XXXXXXX)
Sauvegardez les modifications

Étape 3 : Importer le Conteneur JSON dans GTM

Accédez à Google Tag Manager
Cliquez sur Admin → Importer le conteneur
Téléchargez le fichier JSON fourni
Sélectionnez Fusionner ou Écraser selon vos besoins
Confirmez l'importation: Smeetz-GTM-Container.json

Étape 4 : Configurer le Measurement ID GA4

Après avoir importé le conteneur GTM, vous devez définir votre Measurement ID GA4 :

Allez dans Variables dans Google Tag Manager
Cherchez la variable nommée Measurement ID
Ouvrez-la et remplacez la valeur par votre Measurement ID GA4 (format : G-XXXXXXXXXX)
Sauvegardez les modifications

Étape 5 : Tester dans GTM Preview avant de publier (recommandé)

Dans GTM, cliquez sur Prévisualiser et connectez-le à votre site web.
Ouvrez le widget et effectuez un flux de réservation test.
Confirmez que vous voyez les événements Smeetz dans la timeline de prévisualisation GTM (par exemple smtz_view_item_list, smtz_add_to_cart, smtz_purchase).
Confirmez que vos balises GA4 se déclenchent et que les événements apparaissent dans GA4 Temps réel.

Étape 6 : Publier le conteneur GTM

Dans GTM, cliquez sur Envoyer → Publier.
(Recommandé) Ajoutez un nom de version court comme Configuration e-commerce Smeetz GA4.

Guide de configuration GTM / GA4

1. Avantages de l'utilisation de Google Tag Manager

Suivi Simplifié

Contrôle Centralisé

Avantages Supplémentaires

2. Prérequis

3. Aperçu du Processus de Suivi

Architecture du Flux de Données

4. Événements Suivis

smtz_user_identity

smtz_view_item_list

smtz_dynamicPricing_enabled

smtz_remove_from_cart

smtz_view_cart

smtz_add_to_cart

smtz_begin_checkout

smtz_checkout_progress

smtz_payment_info

smtz_purchase

5. Étapes d'Implémentation

Étape 1 : Installer le snippet GTM sur votre site web (requis)

Étape 2 : Insérer l'ID GTM dans le Back Office Smeetz

Étape 3 : Importer le Conteneur JSON dans GTM

Étape 4 : Configurer le Measurement ID GA4

Étape 5 : Tester dans GTM Preview avant de publier (recommandé)

Étape 6 : Publier le conteneur GTM