Comment installer une heatmap avec Google Tag Manager (sans toucher au code, en 5 minutes)
- how-to
- gtm
- google-tag-manager
- heatmap
- installation
En bref
- Avec GTM, vous pouvez installer une heatmap sans toucher au code de votre site
- Cinq étapes : créer une balise Custom HTML → lui attacher un déclencheur All Pages → publier
- Le succès se mesure aux chiffres qui bougent sur votre tableau de bord HeatMapX — pas seulement à l'absence d'erreurs
Si votre site gère déjà ses balises via Google Tag Manager (GTM), c'est la méthode la plus propre pour ajouter le suivi heatmap : tout se passe dans l'interface GTM, sans aucune modification de code. Ce guide vous explique la procédure étape par étape.
Avant de commencer : récupérez votre clé de site
Inscrivez-vous sur HeatMapX (il existe un plan gratuit, sans carte bancaire requise), enregistrez votre site, et vous obtiendrez une clé de site (site key).
Une fois que vous l'avez, vous utiliserez une balise de cette forme — remplacez VOTRE-CLE-DE-SITE par votre clé réelle :
<script src="https://heatmapx.com/tracker.js?key=VOTRE-CLE-DE-SITE" data-site-key="VOTRE-CLE-DE-SITE"></script>
Important : collez la balise entière, pas seulement l'URL. L'attribut
data-site-key="..."indique à HeatMapX à quel site les données appartiennent — si vous l'omettez, ou si vous ne collez que l'URL dusrc, rien ne sera suivi.
La configuration dans GTM (5 étapes)
- Ouvrez la console GTM (tagmanager.google.com) et sélectionnez le conteneur (espace de travail) de votre site
- Allez dans « Balises » → « Nouvelle » dans le menu de gauche, et choisissez « Custom HTML » comme type de balise
- Collez la balise entière ci-dessus dans le champ HTML
- Dans la section déclencheur, choisissez « All Pages (affichage de page) », donnez à la balise un nom reconnaissable (par exemple HeatMapX), puis enregistrez
- Cliquez sur « Submit / Publish » en haut à droite pour mettre la modification en ligne
C'est terminé — le suivi tourne désormais sur toutes les pages de votre site.
Vous voulez vérifier avant de publier ? (mode Preview)
Cliquez sur « Preview » dans GTM pour tester la balise dans votre propre navigateur avant sa mise en ligne. Ouvrez votre site depuis l'écran de prévisualisation (Tag Assistant) — si votre balise HeatMapX apparaît sous « Fired », c'est que tout fonctionne.
Si la balise ne se déclenche pas — checklist
- Avez-vous cliqué sur Publish ? Enregistrer seul ne met pas les changements en ligne. C'est la cause la plus fréquente
- Le déclencheur est-il bien All Pages ? Un déclencheur limité à une page spécifique signifie que les autres pages ne seront pas suivies
- Une bannière de consentement aux cookies (consent mode) bloque-t-elle la balise ? Avec certains outils de gestion du consentement, les balises Custom HTML sont retenues tant que le visiteur n'a pas donné son consentement. Vérifiez les paramètres de consentement de la balise et comment votre CMP la catégorise
- Le data-site-key est-il correct ? Coller la clé d'un autre site envoie vos données vers le mauvais site
Laissez Claude Code vous guider
Si vous préférez ne pas naviguer vous-même dans l'interface GTM, vous pouvez demander à un agent IA comme Claude Code de vous guider. Copiez le prompt ci-dessous, remplacez-le par votre propre clé de site, puis collez-le.
I want to deploy the HeatMapX heatmap tracking tag via Google Tag Manager.
Walk me through the GTM interface one step at a time, waiting for my reply at each step.
The tag to use (Custom HTML, All Pages trigger):
<script src="https://heatmapx.com/tracker.js?key=YOUR-SITE-KEY" data-site-key="YOUR-SITE-KEY"></script>
Si vous n'utilisez pas GTM et souhaitez insérer la balise directement dans le code de votre site, cette version permet à Claude Code de faire les modifications de fichiers pour vous :
Install the HeatMapX heatmap tracking tag in this project.
Make sure the following tag is included right before </head> on every page, and tell me which files you changed.
<script src="https://heatmapx.com/tracker.js?key=YOUR-SITE-KEY" data-site-key="YOUR-SITE-KEY"></script>
HeatMapX est conçu pour que la récupération et l'analyse de vos données fonctionnent également depuis Claude Code (intégration CLI) — consultez la page « CLI & Skills » de votre tableau de bord une fois l'installation terminée.
Vérifiez que ça fonctionne : les chiffres doivent bouger
Une fois l'installation terminée, parcourez quelques pages de votre site, puis ouvrez votre tableau de bord HeatMapX. Si le nombre de « Sessions today » augmente pour votre site, le suivi est actif.
Le signe de réussite n'est pas « aucune erreur » — c'est les chiffres qui bougent sur le tableau de bord. Si rien ne bouge, reprenez la checklist ci-dessus dans l'ordre.