Comment installer Google Tag Manager sur votre site
Publié: 2022-04-12Google Tag Manager (GTM) est un service gratuit qui simplifie grandement l'utilisation des balises sur les sites Web et dans les applications mobiles. Avec GTM, vous pouvez facilement modifier le code des pages, ajouter de nouveaux fragments et intégrer votre site avec des systèmes d'analyse, de la publicité et d'autres services.
Pour commencer, vous devrez installer le code Tag Manager sur votre site. Après cela, tous les autres paramètres peuvent être ajustés dans l'interface de service sans impliquer les programmeurs. Vous pouvez en savoir plus sur Google Tag Manager et son fonctionnement en conjonction avec Google Analytics dans notre article. Si vous êtes déjà familier avec cela, ne perdons pas de temps et procédons à l'installation de GTM.
En bref, pour installer Google Tag Manager, vous devez :
- créer un compte et un conteneur dans Google Tag Manager ;
- installer le code Google Tag Manager sur votre site ;
- publier le conteneur ;
- vérifiez Google Tag Manager.
1. Créez un compte et un conteneur dans Google Tag Manager
Sur la page d'accueil de Tag Manager, cliquez sur le bouton S'inscrire et connectez-vous à l'aide de votre adresse Gmail ou de tout autre compte Google :
Vous devez maintenant créer un compte directement dans Tag Manager. Pour cela, cliquez sur Se connecter à Tag Manager :
Cliquez ensuite sur Créer un compte :
Pensez à un nom pour votre compte - il est plus pratique d'utiliser le nom de votre entreprise. Sélectionnez ensuite le pays, cochez la case à côté de Partager les données de manière anonyme avec Google et d'autres services (facultatif) et cliquez sur Continuer :
Vous devez maintenant configurer le conteneur. Si vous comparez la structure de Google Tag Manager avec la structure de Google Analytics, alors le conteneur est l'équivalent d'une ressource dans GA. Il stocke les balises, les déclencheurs et les variables pour l'ensemble du site. Il peut y avoir plusieurs conteneurs dans un compte GTM : pour le site Web, pour l'application mobile, pour les pages AMP, etc. Pour plus de commodité, il est préférable de nommer le conteneur d'après la ressource pour laquelle il a été créé. Par exemple, il peut s'agir de l'adresse de votre site.
Après avoir entré le nom du conteneur, sélectionnez où il sera utilisé (dans notre exemple, il s'agit de Web ) et cliquez sur Créer :
Lisez les règles d'utilisation de Tag Manager. Cochez la case en bas de page confirmant que vous acceptez les conditions de traitement des données conformément au RGPD, puis cliquez sur Oui :
Après cela, vous verrez une fenêtre avec le fragment de code GTM qui doit être installé sur votre site Web :
Vous pouvez immédiatement copier le code et l'installer sur toutes les pages du site que vous souhaitez surveiller, ou cliquer sur OK et le faire plus tard lorsque vous ajouterez les premières balises au conteneur. Vous pouvez visualiser et copier le code à tout moment sous Administration → Installer Google Tag Manager :
2. Installez le code Google Tag Manager sur votre site
Si vous êtes familiarisé avec le développement de sites Web et que vous avez accès au panneau d'administration, il est facile d'ajouter le code Tag Manager. Voici un exemple de la façon de procéder via WordPress. Sinon, vous devrez toujours demander l'aide de programmeurs ; sinon, il y a un risque de casser le code source de la page.
Le code Google Tag Manager se compose de deux fragments et est chargé de manière asynchrone. Autrement dit, la partie principale de la page continue de se charger sans attendre le chargement du conteneur GTM. La première partie du code doit être placée dans l'en-tête de la page, aussi près que possible de la balise d'ouverture <head> :
En effet, plus la position du premier fragment est élevée, plus il se chargera rapidement. Si vous l'insérez dans la balise <body>, vous risquez de perdre des données sur les utilisateurs qui quittent la page avant de charger cette balise.
La deuxième partie du code fonctionne comme une sauvegarde et aide à suivre les actions des utilisateurs qui ont désactivé JavaScript. Il doit être placé immédiatement après la balise d'ouverture <body> :
Important!
Le code GTM doit être placé directement sur la page que vous allez tracker, c'est-à-dire sur l'ensemble de votre site. Placer du code dans une iframe masquée ou le déployer dans un autre système de gestion des balises ne permettra pas de suivre correctement les balises sur la page principale.
Installer Google Tag Manager sur une page AMP
Si vous utilisez la technologie AMP pour charger et adapter rapidement des pages pour les appareils mobiles, la première partie du code doit être placée avant la balise de fermeture < /head> :
Et la deuxième partie du code doit être insérée immédiatement après la balise d'ouverture <body> :
3. Publiez le conteneur
Même si vous n'avez pas ajouté une seule balise au conteneur, nous vous recommandons de la publier immédiatement après l'installation du code GTM sur votre site. Sinon, le conteneur provoquera une erreur 404. Ce n'est pas critique, cependant. Si vous suivez les erreurs JavaScript à l'aide de certains services tels que TrackJS, les erreurs 404 jonchent vos rapports. Afin de ne pas stresser inutilement les développeurs, il est préférable de publier un conteneur vide — cela ne nuit à personne.
Pour publier un conteneur, accédez à l'onglet Espace de travail dans Tag Manager et cliquez sur le bouton Soumettre dans l'angle supérieur droit :
Sélectionnez Publier et créer une version . Comme il s'agit de la première version de votre conteneur, le champ Description de la version peut rester vide. Cliquez ensuite sur Publier :
Fait. Le conteneur a été publié.
4. Découvrez Google Tag Manager
Après avoir ajouté le code Tag Manager à votre site, vous pouvez vérifier si les données sont correctement transférées à l'aide de l'extension spéciale Google Tag Assistant. Il s'agit d'un ajout au navigateur Chrome qui montre quelles balises des produits Google sont installées sur votre site et comment elles fonctionnent.
Après avoir téléchargé et installé le module complémentaire, vous verrez cette icône dans votre barre d'outils Chrome
. Cliquez dessus et sélectionnez les balises système que vous souhaitez vérifier et sur quelles pages. Cliquez sur Terminé .
Rendez-vous ensuite sur la page que vous souhaitez consulter et cliquez sur l'icône Tag Assistant. Pour activer l'extension, cliquez sur Activer :
Actualisez la page actuelle et Tag Assistant montrera quelles balises sont installées sur la page et comment elles fonctionnent. Une icône verte indique que les données sont transmises sans aucune plainte, le bleu indique qu'il n'y a pas de problèmes critiques et le rouge signale des problèmes graves :
Si vous cliquez sur une balise spécifique, vous verrez les causes possibles de l'erreur et des conseils pour y remédier :
Vous trouverez plus d'informations sur Tag Assistant dans l'aide de Google.
Quelques conseils supplémentaires
Lors de l'installation du code GTM sur votre site, demandez à votre développeur d'ajouter l'extrait Google Optimize en même temps. C'est une bonne idée même si vous n'allez pas expérimenter le contenu de votre site pour le moment. Chaque fois que vous souhaitez effectuer un test A/B, tout sera prêt.
Cet extrait de code est nécessaire pour charger le conteneur Google Optimize de manière asynchrone et ne pas afficher la page d'origine tant que le conteneur n'est pas chargé. Avec l'extrait de code Optimize, les utilisateurs ne verront pas le contenu d'origine de la page tant que la page contenant les modifications apportées à votre test ne sera pas chargée.
Lorsque vous transférez des balises que vous avez injectées manuellement dans Google Tag Manager, n'oubliez pas de les supprimer du code sur le site afin que les données ne soient pas dupliquées. C'est un point important.
Et après
Après avoir installé le code sur votre site, vous devez ajouter et configurer des balises et des variables dans l'interface de Tag Manager. Pour savoir comment procéder, consultez l'article Qu'est-ce que Google Tag Manager et comment configurer Google Analytics avec lui ou le webinaire Une longueur d'avance : techniques et subtilités de l'utilisation de Google Tag Manager.
PS Nous avons préparé une liste de contrôle de 20 étapes qui doivent être effectuées par les analystes marketing afin de prendre des décisions basées sur des données correctes et complètes. Remplissez le formulaire et nous vous enverrons la liste de contrôle par e-mail.