Google Tag Manager (GTM) est installé sur 30 % des sites web (source : BuiltWith, 2025). Son avantage : ajouter, modifier ou supprimer des scripts de tracking sans toucher au code source du site. Fini les allers-retours avec le développeur pour un simple pixel de conversion.
Mais voilà. J'ai vu au moins 20 fois sur mes audits une agence qui avait configuré GTM n'importe comment : balises doublonnées, triggers qui ne se déclenchaient jamais, dataLayer qui changeait sans qu'on le sache. Résultat ? Le ROI s'écroulait, et personne ne savait pourquoi parce que le tracking était cassé en silence. Donc oui, GTM mal configuré peut vraiment pourrir les données de conversion. Voici les essentiels pour éviter ce piège.
Qu'est-ce que Google Tag Manager ?#
Pour approfondir ce sujet, consultez notre article sur SEO WordPress : guide d'optimisation complet.
GTM est un gestionnaire de balises gratuit. Il sert d'intermédiaire entre ton site web et les outils tiers (GA4, Google Ads, Facebook Pixel, Hotjar, etc.). Au lieu d'insérer chaque script directement dans le code HTML, tu les gères tous depuis l'interface GTM.
GTM fonctionne autour de trois concepts qui méritent qu'on s'y arrête.
Un tag (ou balise) est le script à exécuter. Ce peut être une balise GA4, un pixel Facebook, un script Hotjar, une notification Slack, n'importe quel code qu'on veut déclencher.
Un trigger (ou déclencheur) est la condition qui décide quand le tag s'exécute. "Chargement de la page", "clic sur ce bouton", "scroll jusqu'à 75 %", "soumission du formulaire", "5 secondes après le chargement". Sans trigger, le tag ne se déclenche jamais.
Une variable c'est les données qu'on transmet avec le tag. L'URL de la page qu'on vient de charger, le texte du bouton cliqué, la valeur du produit dans le panier, le nom de l'utilisateur. Les variables alimentent les tags avec des infos dynamiques.
Un tag se déclenche quand un trigger est activé, et il utilise des variables pour envoyer les bonnes données.
Installation de GTM#
Étape 1 : Créer un compte et un conteneur#
- Va sur tagmanager.google.com
- Crée un compte (nom de l'entreprise)
- Crée un conteneur (nom du site, type : Web)
- Note ton ID de conteneur :
GTM-XXXXXXX
Étape 2 : Installer le snippet sur ton site#
GTM te donne deux blocs de code :
Bloc 1, à insérer dans le <head> (le plus haut possible) :
<script>
(function (w, d, s, l, i) {
w[l] = w[l] || [];
w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s),
dl = l != "dataLayer" ? "&l=" + l : "";
j.async = true;
j.src = "https://www.googletagmanager.com/gtm.js?id=" + i + dl;
f.parentNode.insertBefore(j, f);
})(window, document, "script", "dataLayer", "GTM-XXXXXXX");
</script>
Bloc 2, à insérer immédiatement après l'ouverture de <body> :
<noscript
><iframe
src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0"
width="0"
style="display:none;visibility:hidden"
></iframe
></noscript>
Installation sur WordPress#
Deux options :
- Plugin : "GTM4WP" (gratuit), insère automatiquement les snippets et gère le dataLayer pour WooCommerce
- Manuel : via l'éditeur de thème (functions.php ou header.php), pour les développeurs
Installation sur Next.js / React#
Utilise le composant @next/third-parties (GoogleTagManager) ou insère les snippets manuellement dans le layout racine.
Vérification#
Après installation, active le mode Preview dans GTM (bouton "Aperçu" en haut à droite). Un debugger s'ouvre en bas de ton site et montre en temps réel les tags qui se déclenchent, les triggers activés et les variables disponibles.
Configurer GA4 via GTM#
Pourquoi passer par GTM plutôt que le snippet GA4 direct ?#
- Flexibilité : ajouter des événements personnalisés sans code
- Centralisation : tous les scripts au même endroit
- Consent Mode : gérer le consentement RGPD de manière centralisée
- Versioning : historique des modifications, possibilité de rollback
Tag GA4 : Configuration#
- Dans GTM, va dans Tags → Nouveau
- Choisis le type Google Analytics: GA4 Configuration
- Entre ton Measurement ID (G-XXXXXXXXXX), tu le trouves dans GA4 → Admin → Data Streams
- Trigger : All Pages (toutes les pages)
- Nomme le tag : "GA4, Configuration"
- Enregistre
Tag GA4 : Événement personnalisé#
Pour tracker un clic sur un bouton CTA :
- Tag : Google Analytics: GA4 Event
- Configuration Tag : sélectionne le tag GA4 Configuration créé ci-dessus
- Event Name :
cta_click - Event Parameters :
button_text={{Click Text}} - Trigger : nouveau trigger → type "Click, All Elements" → condition : Click Text contient "Demander un devis"
Les triggers essentiels#
Le trigger Page View se déclenche au chargement de chaque page. Tu configures si c'est "All Pages" ou seulement certaines URLs.
Le trigger Click se déclenche quand un visiteur clique. Tu peux filtrer par CSS selector (classe, ID), par texte exact du bouton, ou par URL de destination.
Le trigger Form Submission se déclenche à la soumission d'un formulaire. Filtre par form ID ou par l'attribut action du formulaire.
Le trigger Scroll Depth se déclenche quand l'utilisateur scroll jusqu'à un seuil (25 %, 50 %, 75 %, 90 %). Utile pour mesurer l'engagement.
Le trigger Timer se déclenche après X millisecondes sur la page. 30 000 = 30 secondes.
Le trigger YouTube Video se déclenche sur les événements de lecture vidéo (start, pause, 100 % completed, progression).
Le trigger Custom Event se déclenche quand un événement spécifique est pushé dans le dataLayer côté site.
Le trigger History Change se déclenche quand l'historique de navigation change (utile pour les SPA, Single Page Apps).
L'astuce du scroll depth#
Tracker le scroll est un indicateur d'engagement bien plus fiable que le temps passé (qui est faussé par les onglets inactifs). Un scroll à 75 % sur un article de 2 000 mots signifie que le visiteur a lu la majorité du contenu.
Configuration :
- Nouveau trigger → Scroll Depth
- Type : Vertical Scroll Depths
- Percentages : 25, 50, 75, 90
- Associe ce trigger à un tag GA4 Event avec event name
scroll_depthet parameterscroll_percentage = {{Scroll Depth Threshold}}
Le dataLayer : communiquer entre le site et GTM#
Le dataLayer est un tableau JavaScript qui sert de pont entre ton site et GTM. Quand ton site web génère des données (ajout au panier, connexion utilisateur, transaction), il les pousse dans le dataLayer, et GTM peut les lire via des variables.
Exemple : tracker un achat e-commerce#
Côté site (JavaScript) :
dataLayer.push({
event: 'purchase',
ecommerce: {
transaction_id: 'T-12345',
value: 89.9,
currency: 'EUR',
items: [
{
item_name: 'Formation SEO',
item_id: 'FORM-001',
price: 89.9,
quantity: 1,
},
],
},
})
Côté GTM :
- Variable : Data Layer Variable → nom :
ecommerce.value - Trigger : Custom Event → event name :
purchase - Tag : GA4 Event → event :
purchase→ parameters : les variables dataLayer
Consent Mode et RGPD#
En France, le consentement est obligatoire avant de déposer des cookies de tracking (directive ePrivacy + RGPD). GTM intègre le Consent Mode de Google, qui adapte le comportement des tags selon le consentement de l'utilisateur.
Configuration#
- Active le Consent Mode dans les paramètres du conteneur GTM
- Intègre une CMP (Consent Management Platform) : Axeptio, Didomi, CookieBot, ou Tarteaucitron
- La CMP communique l'état du consentement à GTM via le dataLayer
- Les tags GA4 respectent automatiquement le consentement : données anonymisées si refus, tracking complet si acceptation
Le mode Granted signifie consentement accepté. Les cookies se déposent normalement, GA4 collecte les données complètes, rien ne change de ton côté. C'est transparent.
Le mode Denied signifie consentement refusé. GA4 ne dépose pas de cookies, ne suit pas l'utilisateur individuellement, mais continue à envoyer des "pings anonymisés" vers Google qui les agrège et modélise pour te donner des insights globaux. Tu perds la granularité utilisateur, mais tu garderas une vue de haut niveau.
Pour approfondir les enjeux de conformité, consulte notre article sur RGPD et analytics.
Les erreurs à éviter#
Publier sans tester. Toujours utiliser le mode Preview avant de publier un conteneur. Un tag mal configuré peut casser le tracking de tout le site, ou pire, déclencher une boucle de chargement qui ralentit les pages. C'est du vécu : j'ai vu un site ralentir de 2 secondes de Largest Contentful Paint juste parce qu'un pixel Facebook était mal configuré et relançait la page sans fin.
Trop de tags. Chaque tag est un script qui s'exécute au chargement. 5 tags bien configurés valent mieux que 30 tags dont la moitié sont obsolètes. Audite régulièrement et supprime les tags inutilisés.
Variables non testées. Une variable de dataLayer qui retourne undefined parce que le développeur a changé le format des données, c'est un tracking silencieusement cassé. Vérifie les variables dans le debugger après chaque mise à jour du site. Les clients me disent "mon tracking s'est cassé du jour au lendemain". Spoiler : c'est jamais du jour au lendemain. C'est presque toujours une variable qui s'est cassée en arrière-plan, et personne ne l'a vérifiée.
Pas de convention de nommage. Avec 20 tags, 15 triggers et 30 variables, ça devient vite le chaos. Adopte une convention : [Outil], [Type] - [Description]. Exemple : "GA4, Event, CTA Click", "FB, Pixel, Purchase".
FAQ#
GTM ralentit-il le site ?#
Le snippet GTM lui-même est léger (moins de 50 Ko). Ce sont les tags qu'il charge qui peuvent impacter la performance. Chaque tag tiers (Facebook Pixel, Hotjar, etc.) ajoute du poids. Limite le nombre de tags et utilise le chargement asynchrone (par défaut dans GTM).
Peut-on utiliser GTM sans développeur ?#
Pour les configurations de base (GA4, pixels publicitaires, scroll tracking), oui. L'interface est visuelle et ne nécessite pas de code. Pour le dataLayer (e-commerce, événements personnalisés), un développeur est nécessaire pour pousser les données côté site.
GTM remplace-t-il le snippet GA4 ?#
Non, il le gère. Au lieu d'insérer le snippet GA4 dans le code HTML, tu crées un tag GA4 dans GTM. Le résultat est le même (GA4 collecte les données), mais la gestion est centralisée dans GTM.
Combien de conteneurs GTM par site ?#
Un seul. Installer plusieurs conteneurs GTM sur le même site est une source de conflits et de doublons de tracking. Si tu gères plusieurs sites, crée un conteneur par site dans le même compte GTM.
