Comment ajouter Google Tag Manager à votre site (installation) | We.Inc
Installez Google Tag Manager comme Google le documente : snippets head et body, balise Google pour GA4, mode Aperçu et suivi des single-page apps. Générateur de snippets pour votre ID GTM.
Créez un conteneur dans Tag Manager pour obtenir un ID du type GTM-ABCD123. Collez le premier snippet de Google le plus haut possible dans le <head> et le second, une iframe noscript, juste après la balise d'ouverture <body>, sur chaque page. Ajoutez ensuite des balises, comme votre balise Google Analytics, dans Tag Manager, puis publiez.
L'installation en un coup d'œil
Étape
Où
Ce que vous faites
1. Créer un conteneur
Choisissez Web comme plateforme et notez l'ID GTM-
2. Installer les snippets
Le HTML de votre site ou les réglages du thème
Snippet head en haut du <head>, snippet noscript juste après <body>
3. Ajouter une balise
Espace de travail Tag Manager
Pour Analytics : type de balise Google Tag avec votre ID G-
4. Tester
Bouton Aperçu
Tag Assistant se connecte à votre site et montre quelles balises se sont déclenchées
5. Publier
Envoyer dans l'espace de travail
Rien n'est en ligne sur votre site tant que vous n'avez pas publié
Google Tag Manager est un conteneur gratuit pour les codes de suivi. Au lieu de coller le script de chaque outil dans votre site, vous installez un conteneur une seule fois, puis vous ajoutez, modifiez ou supprimez des balises (de petits scripts pour l'analytics, la publicité et des outils similaires) depuis le site de Tag Manager. Saisissez l'ID de votre conteneur dans le générateur pour obtenir les deux snippets prêts à coller.
Saisissez l'ID de votre conteneur. Le générateur vérifie qu'il ressemble à GTM- suivi de lettres et de chiffres.
Copiez le snippet head dans le <head> de chaque page, le plus haut possible.
Copiez le snippet body sur la ligne juste après la balise d'ouverture <body>.
Ouvrez Tag Manager, cliquez sur Aperçu, saisissez l'adresse de votre site et vérifiez que Tag Assistant indique Connecté.
Installez un seul conteneur par site. Le guide de Google sur la couche de données avertit que plusieurs couches de données sur une page font mal se déclencher les balises.
Si une page définit des données pour les balises, placez window.dataLayer = window.dataLayer || []; et vos appels push au-dessus du snippet du conteneur.
Supprimez tout code Analytics collé directement avant d'ajouter la même balise dans Tag Manager, sinon chaque visite est comptée deux fois.
Beaucoup de créateurs de sites proposent un champ pour l'ID GTM. Utilisez-le si le vôtre en a un, et ne collez rien à la main.
Questions fréquentes
Où placer exactement le code Google Tag Manager ?
L'aide d'installation de Google indique de coller le premier bloc le plus haut possible dans la balise <head> et le second bloc juste après la balise d'ouverture <body>, sur chaque page du site.
Ai-je encore besoin de la partie noscript ?
Google l'inclut dans le code d'installation. C'est une iframe placée dans un élément noscript, que les navigateurs n'utilisent que lorsque JavaScript est désactivé. Collez-la exactement telle que Google vous la donne.
Comment ajouter Google Analytics 4 via Tag Manager ?
Dans Tag Manager, ajoutez une nouvelle balise, choisissez Google Tag comme type et saisissez votre ID de balise commençant par G-. Choisissez un déclencheur d'initialisation, enregistrez, testez dans Aperçu puis publiez.
Pourquoi Tag Manager ne suit-il pas les changements de page dans ma single-page app ?
Les applications qui changent de page sans recharger ne déclenchent pas de nouveau chargement de page. Utilisez le déclencheur Modification de l'historique, qui selon Google se déclenche quand le fragment de l'URL change ou quand le site utilise l'API HTML5 pushState.
Google Tag Manager est-il gratuit ?
La version standard est gratuite. Google vend aussi Tag Manager 360 dans le cadre de ses produits pour les grandes entreprises.
Tester avec le mode Aperçu
Dans votre espace de travail, cliquez sur Aperçu en haut à droite. Tag Assistant s'ouvre dans un nouvel onglet : saisissez l'adresse de votre site et cliquez sur Connecter. Votre site s'ouvre dans une nouvelle fenêtre et affiche Connecté dans un coin.
De retour dans l'onglet Tag Assistant, cliquez sur Continuer pour voir chaque événement et les balises qui se sont déclenchées. Corrigez tout ce qui ne s'est pas déclenché avant de publier.
Envoyer vos propres événements
La couche de données est un tableau JavaScript qui transmet des informations à Tag Manager. Poussez un objet avec une clé event, comme une inscription à la newsletter, et créez un déclencheur Événement personnalisé portant le même nom.
Le guide de Google précise que la couche de données est sensible à la casse, donc dataLayer fonctionne et datalayer non, et qu'il faut toujours y faire des push, jamais la réaffecter.
Pousser un événement dans la couche de données
Utilisez ceci quand il se passe quelque chose que Tag Manager ne peut pas voir seul, comme un formulaire qui s'envoie sans quitter la page.
Événement d'inscription à la newsletter
Créez dans Tag Manager un déclencheur Événement personnalisé nommé newsletter_signup pour y déclencher des balises.
Les déclencheurs que vous utiliserez en premier
Déclencheurs Tag Manager courants
Déclencheur
Se déclenche quand
Usage typique
Initialisation
Avant tous les autres déclencheurs sauf Initialisation du consentement
Google Tag pour Analytics
Page vue
Quand le navigateur commence à charger une page
La plupart des autres balises au niveau de la page
Modification de l'historique
Le fragment de l'URL change ou la page appelle pushState
Pages vues dans les single-page apps
Événement personnalisé
Votre code pousse un événement correspondant dans la couche de données
Envois de formulaire, inscriptions, réservations
Clic
Un visiteur clique sur un élément ou un lien
Clics sur les liens téléphone et e-mail
Générateur de snippets
Saisissez l'ID du conteneur affiché en haut de votre espace de travail Tag Manager. Tout est généré dans votre navigateur.
ID du conteneur
Cela semble correct. Collez les deux snippets sur chaque page.
Cela ne ressemble pas à un ID de conteneur. Il doit commencer par GTM- suivi de lettres et de chiffres.
1. À coller le plus haut possible dans le <head>
2. À coller juste après la balise d'ouverture <body>