15%

Économisez 15% sur tous les services d'hébergement

Testez vos compétences et obtenez Réduction sur tout plan d'hébergement

Utilisez le code :

Skills
Commencer
21.10.2024

Comment configurer Google Tag Manager et trouver votre identifiant GTM

Google Tag Manager (GTM) est un système de gestion de balises (TMS) gratuit de Google qui vous permet de déployer et de gérer des extraits de code JavaScript de suivi — appelés balises — sur votre site web via une interface web centralisée, sans toucher directement au code source de votre site. Votre ID de conteneur GTM (au format GTM-XXXXXXX) est l’identifiant unique qui relie l’extrait de conteneur installé sur votre site web à votre compte GTM, et il est requis chaque fois que vous intégrez GTM avec des plateformes externes comme Google Analytics 4, Meta Pixel, ou tout autre consommateur de couche de données tiers.

Ce guide couvre l’intégralité du processus de configuration de bout en bout : création du compte et du conteneur, installation des extraits de code sur différentes plateformes, localisation de votre ID de conteneur, et les étapes critiques de vérification post-installation que la plupart des tutoriels omettent.

Qu’est-ce que Google Tag Manager et pourquoi est-il important pour l’architecture de site

Avant de toucher à toute configuration, il est utile de comprendre ce que GTM fait réellement au niveau de l’infrastructure. Lorsqu’un navigateur charge votre page, l’extrait de conteneur GTM envoie une requête à https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX. Les serveurs de Google renvoient un bundle JavaScript compilé contenant uniquement les balises, déclencheurs et variables que vous avez publiés dans votre version de conteneur actuelle. Cela signifie :

  • Aucun script de suivi codé en dur n’est dispersé dans vos modèles HTML.
  • Le déclenchement des balises est conditionnel — les déclencheurs évaluent les événements DOM, les modèles d’URL ou le JavaScript personnalisé avant qu’une balise ne s’exécute.
  • Le contrôle de version est intégré — chaque version de conteneur publiée est sauvegardée, et vous pouvez effectuer un retour arrière instantanément.
  • Un seul conteneur peut contenir des centaines de balises de différents fournisseurs, toutes gérées depuis un seul tableau de bord.

Cette architecture est particulièrement précieuse lorsque votre site fonctionne dans un environnement d’Hébergement VPS où vous contrôlez l’ensemble de la pile, car elle découple entièrement l’instrumentation marketing de votre pipeline de déploiement.

Étape 1 : Créer un compte et un conteneur Google Tag Manager

Compte vs. Conteneur — Comprendre la hiérarchie

GTM utilise une hiérarchie à deux niveaux :

  • Compte : Représente généralement votre entreprise ou organisation. Un compte par entreprise est la pratique standard.
  • Conteneur : Représente une unité déployable unique — généralement un site web, une application mobile ou une propriété AMP. Un seul compte peut contenir plusieurs conteneurs.

Confondre ces deux niveaux est une erreur courante. Si vous gérez le suivi pour shop.example.com et blog.example.com en tant que propriétés distinctes, ils doivent être des conteneurs séparés sous le même compte — et non des comptes séparés.

Création du compte

  1. Accédez à tagmanager.google.com et connectez-vous avec le compte Google qui possède ou a un accès administrateur à votre propriété Google Analytics.
  2. Cliquez sur Créer un compte.
  3. Saisissez votre Nom de compte (le nom de votre entreprise ou marque).
  4. Sélectionnez votre Pays.
  5. Laissez Partager des données de manière anonyme avec Google coché ou décochez-le selon les exigences de votre politique de confidentialité.

Configuration du conteneur

Dans le même flux de création :

  1. Saisissez un Nom de conteneur — utilisez le domaine complet (par ex., example.com) pour plus de clarté.
  2. Sous Plateforme cible, sélectionnez l’option appropriée :
Option de plateformeCas d’utilisation
WebSites web HTML/JavaScript standard
iOSApplications iOS natives utilisant Firebase SDK
AndroidApplications Android natives utilisant Firebase SDK
AMPAccelerated Mobile Pages
ServerBalisage côté serveur (conteneur serveur GTM)

Pour la plupart des projets web, sélectionnez Web.

  1. Cliquez sur Créer et acceptez les Conditions d’utilisation de Google Tag Manager. Si vous opérez sous juridiction GDPR, lisez l’Avenant sur le traitement des données avant d’accepter.

Après acceptation, GTM présente immédiatement vos deux extraits de code de conteneur. Ne fermez pas cette fenêtre avant de les avoir copiés.

Étape 2 : Installer l’extrait de conteneur GTM sur votre site web

GTM nécessite deux extraits de code séparés placés à des emplacements spécifiques. Les placer incorrectement est l’une des erreurs d’implémentation les plus courantes et peut entraîner un déclenchement tardif des balises, des pages vues manquées, ou des échecs complets sur certains navigateurs.

Les deux extraits requis

Extrait 1 — Placement <head> (JavaScript) :

<!-- Google Tag Manager -->
<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>
<!-- End Google Tag Manager -->

Placez ceci aussi haut que possible dans le <head> — idéalement immédiatement après la balise d’ouverture <head>.

Extrait 2 — Placement <body> (solution de repli noscript) :

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Placez ceci immédiatement après la balise d’ouverture <body>. Cet iframe <noscript> est la solution de repli pour les navigateurs avec JavaScript désactivé — il garantit que le déclenchement de base des balises se produit toujours via un chargement de pixel iframe.

Note critique : Remplacez GTM-XXXXXXX par votre ID de conteneur réel dans les deux extraits.

Installation sur WordPress

WordPress est le CMS le plus courant pour les déploiements GTM. Vous disposez de trois méthodes :

Méthode A — functions.php du thème (directe, sans dépendance de plugin) :

// Add to your child theme's functions.php
function add_gtm_head() {
    echo "<!-- Google Tag Manager --><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><!-- End Google Tag Manager -->";
}
add_action('wp_head', 'add_gtm_head', 1);

function add_gtm_body() {
    echo '<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" height="0" width="0"></iframe></noscript>';
}
add_action('wp_body_open', 'add_gtm_body', 1);

Méthode B — Plugin (Insert Headers and Footers ou GTM4WP) : Installez le plugin, collez l’Extrait 1 dans le champ d’en-tête et l’Extrait 2 dans le champ body/after-body. Le plugin GTM4WP est préféré aux plugins génériques d’en-tête/pied de page car il pousse également les données spécifiques à WordPress (type de publication, auteur, données du panier WooCommerce) dans le dataLayer automatiquement.

Méthode C — Édition directe du modèle : Modifiez header.php dans votre thème pour insérer les deux extraits aux positions correctes. Utilisez toujours un thème enfant — modifier directement un thème parent signifie que vos modifications seront effacées lors de la prochaine mise à jour du thème.

Installation sur Shopify

Shopify restreint l’accès direct à <head> au fichier theme.liquid. Accédez à Boutique en ligne > Thèmes > Modifier le code > Mise en page > theme.liquid et insérez les deux extraits aux positions appropriées. Notez que les pages de paiement de Shopify nécessitent un plan Shopify Plus pour ajouter des scripts personnalisés.

Installation sur un site HTML personnalisé/rendu côté serveur

Si vous gérez une application personnalisée sur un Serveur Dédié ou VPS, modifiez directement votre modèle HTML de base. Pour les frameworks rendus côté serveur (Node.js/Express, Django, Laravel), ajoutez les extraits à votre fichier de modèle de mise en page de base.

Pour une application Node.js/Express utilisant des modèles EJS :

# Locate your base layout template
find /var/www/myapp/views -name "layout.ejs"

Modifiez ensuite le fichier pour insérer les deux extraits GTM aux positions correctes dans le <head> et immédiatement après <body>.

Considérations relatives à la politique de sécurité du contenu

Si votre site applique un en-tête Content Security Policy (CSP) — ce qui devrait être le cas sur tout serveur de production renforcé — vous devez mettre les domaines de GTM en liste blanche. Ajoutez ce qui suit à vos directives CSP :

script-src 'self' https://www.googletagmanager.com;
img-src 'self' https://www.googletagmanager.com;
frame-src https://www.googletagmanager.com;

Ne pas mettre à jour votre CSP bloquera silencieusement le chargement de GTM, et aucune erreur n’apparaîtra dans l’interface propre de GTM — uniquement dans la console du navigateur.

Étape 3 : Trouver votre ID Google Tag Manager

Votre ID de conteneur GTM est toujours au format GTM- suivi d’une chaîne alphanumérique (par ex., GTM-K2F9XP3). Il existe trois méthodes fiables pour le localiser.

Méthode 1 — Tableau de bord du conteneur (méthode principale)

  1. Connectez-vous sur tagmanager.google.com.
  2. Sur la page de vue d’ensemble des Comptes, vous verrez tous vos comptes et leurs conteneurs associés listés dans des cartes.
  3. L’ID du conteneur (GTM-XXXXXXX) est affiché directement sous le nom du conteneur sur chaque carte — visible sans cliquer dans le conteneur.

Méthode 2 — Panneau d’administration du conteneur

  1. Ouvrez le conteneur souhaité.
  2. Cliquez sur Administration dans la barre de navigation supérieure.
  3. Sous la colonne Conteneur, cliquez sur Paramètres du conteneur.
  4. Le champ ID du conteneur en haut de cette page affiche votre ID GTM complet.

Méthode 3 — Source de la page installée

Si GTM est déjà installé sur votre site et que vous devez récupérer l’ID sans vous connecter à GTM :

curl -s https://example.com | grep -o 'GTM-[A-Z0-9]*'

Cette commande récupère la source de votre page et extrait toute chaîne d’ID de conteneur GTM à l’aide d’un modèle regex — utile pour auditer des sites tiers ou vérifier quel conteneur est réellement actif.

Étape 4 : Vérifier l’installation

Ignorer la vérification est l’erreur la plus coûteuse dans les déploiements GTM. Un extrait mal placé, un blocage CSP ou un remplacement de thème peut silencieusement briser toute votre configuration de suivi.

Mode Aperçu GTM (recommandé)

  1. Dans votre conteneur, cliquez sur Aperçu dans le coin supérieur droit.
  2. Saisissez l’URL de votre site web et cliquez sur Connecter.
  3. Un nouvel onglet de navigateur ouvre votre site avec le panneau Tag Assistant attaché.
  4. Le panneau affiche chaque balise déclenchée au chargement de la page, les déclencheurs qui les ont activées, et l’état complet de dataLayer.

Si le conteneur se charge correctement, vous verrez gtm.js listé comme balise déclenchée et gtm.load comme événement complété dans le panneau de résumé.

Extension Chrome Google Tag Assistant

Installez l’extension Tag Assistant Legacy ou utilisez la nouvelle extension Tag Assistant Companion. Accédez à votre site et l’extension confirmera si GTM est détecté, affichera l’ID de conteneur trouvé, et signalera toute erreur d’implémentation (comme l’extrait placé au mauvais endroit ou se déclenchant plusieurs fois).

Vérification manuelle via la console du navigateur

Ouvrez Chrome DevTools (F12), allez dans l’onglet Réseau, filtrez par gtm.js, et rechargez la page. Vous devriez voir une réponse 200 réussie de www.googletagmanager.com. Si vous voyez une requête bloquée ou échouée, vérifiez vos en-têtes CSP et les règles de pare-feu du serveur.

# Check response headers from GTM's script endpoint
curl -I "https://www.googletagmanager.com/gtm.js?id=GTM-XXXXXXX"

Étape 5 : Utiliser votre ID GTM avec des plateformes tierces

Une fois votre conteneur vérifié, l’ID GTM est utilisé dans plusieurs contextes d’intégration :

Google Analytics 4

N’installez pas l’extrait gtag.js de GA4 directement sur la page si GTM est présent. Créez plutôt une balise Google (anciennement balise de configuration GA4) dans GTM, saisissez votre ID de mesure GA4 (G-XXXXXXXXXX), et définissez le déclencheur sur Toutes les pages. Cela maintient tout le suivi centralisé dans GTM.

Meta (Facebook) Pixel

Ajoutez une balise HTML personnalisée dans GTM contenant le code de base Meta Pixel. Utilisez les variables intégrées de GTM ({{Page URL}}, {{Click URL}}) pour renseigner les paramètres d’événements de manière dynamique plutôt que de les coder en dur.

Plugins WordPress demandant l’ID GTM

Des plugins comme Rank Math, MonsterInsights, ou WooCommerce Google Analytics peuvent demander votre ID GTM directement. Si vous avez déjà installé l’extrait GTM manuellement ou via GTM4WP, ne saisissez pas votre ID GTM dans ces plugins également — cela entraînera le chargement du conteneur deux fois, doublant tous les déclenchements de balises et gonflant vos données analytiques.

GTM côté serveur (avancé)

Pour les sites à fort trafic ou les déploiements sensibles à la confidentialité, GTM prend en charge un conteneur côté serveur qui s’exécute sur votre propre infrastructure. Au lieu que le navigateur charge les balises directement depuis les CDN des fournisseurs, toutes les requêtes passent d’abord par votre serveur. Cela améliore les performances de chargement des pages, contourne les bloqueurs de publicités, et vous donne un contrôle total sur les données qui quittent votre infrastructure. L’exécution d’un conteneur GTM côté serveur est bien adaptée à un VPS avec cPanel ou un VPS brut où vous pouvez configurer Node.js ou un serveur de balisage conteneurisé.

Comparaison des types de conteneurs GTM

Type de conteneurEmplacement de déploiementCas d’utilisation principalNécessite une infrastructure serveur
WebNavigateur (côté client)Suivi de site web standardNon
iOS / AndroidApplication mobileSuivi des événements d’application via FirebaseNon
AMPPages AMPSuivi sur Accelerated Mobile PagesNon
ServerVotre serveurSuivi axé sur la confidentialité et haute performanceOui

Pièges courants et cas particuliers

Conteneurs se déclenchant en double : Si votre thème WordPress inclut déjà GTM via un extrait codé en dur et que vous activez également un plugin qui injecte GTM, les deux se déclencheront. Auditez toujours la source de votre page avec curl -s https://example.com | grep -c 'GTM-' pour compter les occurrences.

Mauvais environnement de conteneur : GTM prend en charge plusieurs Environnements (Live, Développement, Staging). Si un développeur partage un lien d’aperçu utilisant un jeton d’environnement non-live, les balises peuvent se comporter différemment qu’en production. Testez toujours par rapport à l’environnement Live avant validation.

Ordre d’initialisation du dataLayer : Si votre site pousse des données vers window.dataLayer avant le chargement de l’extrait GTM, ces envois sont perdus. Le tableau dataLayer doit être initialisé avant l’extrait GTM, ou l’extrait lui-même gère l’initialisation — mais tout envoi qui se produit avant l’exécution de l’extrait n’est pas capturé. C’est une source fréquente de données e-commerce manquantes sur les pages à chargement lent.

Exigence HTTPS : Le gtm.js de GTM est toujours servi via HTTPS. Si votre site fonctionne encore en HTTP, la politique de contenu mixte dans les navigateurs modernes bloquera le script GTM. Assurez-vous que votre site dispose d’un certificat SSL valide — les Certificats SSL sont un prérequis pour tout déploiement GTM en production.

Séquençage des balises : Lorsque plusieurs balises se déclenchent sur le même déclencheur, l’ordre d’exécution n’est pas garanti sauf si vous configurez explicitement le Séquençage des balises (Balise de configuration / Balise de nettoyage) dans les paramètres avancés des balises de GTM.

Matrice de décision pratique

Utilisez cette liste de contrôle avant de considérer votre configuration GTM prête pour la production :

  • [ ] L’extrait de conteneur est présent dans <head> et immédiatement après <body> sur chaque page, y compris les pages générées dynamiquement.
  • [ ] L’ID GTM apparaît exactement une fois par page — confirmé via curl ou l’inspection de la source du navigateur.
  • [ ] Les en-têtes CSP mettent en liste blanche www.googletagmanager.com pour script-src, img-src, et frame-src.
  • [ ] Le mode Aperçu confirme que le conteneur se charge et que gtm.js se déclenche au chargement de la page.
  • [ ] Aucun extrait GA4 ou autre fournisseur en double n’existe en dehors de GTM.
  • [ ] dataLayer est initialisé avant l’extrait GTM dans la source HTML.
  • [ ] Si vous utilisez WordPress, un thème enfant ou un plugin dédié (pas le thème parent) contient l’extrait.
  • [ ] Les règles de pare-feu côté serveur autorisent les requêtes sortantes vers www.googletagmanager.com:443.
  • [ ] Pour l’e-commerce : les envois dataLayer pour les événements purchase, add_to_cart, et view_item sont vérifiés en mode Aperçu avant la mise en ligne.
  • [ ] Le conteneur est publié — les modifications non publiées n’existent que dans l’espace de travail et n’affectent pas le site en ligne.

Si votre environnement d’hébergement est un plan d’Hébergement Web Mutualisé géré sans accès direct au serveur, concentrez-vous sur les méthodes d’installation au niveau du CMS (plugin ou fichier de thème) et fiez-vous au mode Aperçu de GTM pour la vérification plutôt qu’aux commandes curl au niveau du serveur.

FAQ

Qu’est-ce qu’un ID de conteneur GTM et où est-il utilisé ?

Un ID de conteneur GTM est un identifiant unique au format GTM-XXXXXXX qui relie l’extrait JavaScript installé sur votre site web à votre conteneur GTM spécifique. Il est utilisé dans le code de l’extrait de conteneur, dans les intégrations de plateformes tierces, et dans l’interface d’administration propre de GTM pour identifier quelle configuration de balises de conteneur doit être chargée.

Puis-je utiliser le même conteneur GTM sur plusieurs domaines ?

Techniquement oui — le même extrait peut être placé sur plusieurs domaines — mais ce n’est pas recommandé. Les balises et déclencheurs configurés pour la structure d’URL d’un domaine produiront des données peu fiables sur un domaine différent. La bonne approche est de créer un conteneur séparé par domaine et d’utiliser la configuration de suivi inter-domaines dans GA4 si vous devez suivre les parcours utilisateurs sur les deux.

Pourquoi mon conteneur GTM ne se déclenche-t-il pas même si l’extrait est installé ?

Les causes les plus courantes sont : une politique de sécurité du contenu bloquant www.googletagmanager.com, l’extrait placé dans un commentaire conditionnel ou une partie de modèle chargée de manière asynchrone, un plugin de mise en cache WordPress servant une page mise en cache construite avant l’ajout de l’extrait, ou le conteneur n’ayant aucune version publiée. Vérifiez la console du navigateur pour les violations CSP et utilisez le mode Aperçu de GTM pour isoler le problème.

Quelle est la différence entre le mode Aperçu GTM et Tag Assistant ?

Le mode Aperçu GTM est une fonctionnalité intégrée de GTM qui connecte une session de débogage directement à votre conteneur, affichant le déclenchement des balises en temps réel, l’évaluation des déclencheurs, et l’état de dataLayer pour votre session de navigateur spécifique. Tag Assistant est une extension Chrome qui fournit une superposition plus légère montrant quelles balises Google (GTM, GA4, Ads) sont détectées sur une page et signale les erreurs d’implémentation de base. Pour un débogage approfondi, le mode Aperçu fait autorité ; Tag Assistant est utile pour des vérifications rapides en surface.

Google Tag Manager affecte-t-il les performances du site web ou la vitesse de chargement des pages ?

L’extrait GTM lui-même est chargé de manière asynchrone, il ne bloque donc pas l’analyse HTML ni les ressources bloquant le rendu. Cependant, les balises déclenchées par GTM — en particulier les balises HTML personnalisées synchrones ou les scripts tiers lourds — peuvent avoir un impact significatif sur le temps de chargement des pages. Auditez régulièrement les balises de votre conteneur, utilisez les contrôles de priorité et de séquençage des balises intégrés de GTM, et envisagez GTM côté serveur pour les sites à fort trafic où la surcharge de scripts côté client est une préoccupation mesurable.

15%

Économisez 15% sur tous les services d'hébergement

Testez vos compétences et obtenez Réduction sur tout plan d'hébergement

Utilisez le code :

Skills
Commencer