Aller au contenu principal

Aide du site Web

Deutsch English Español Italiano Português

Centre d'aide

Comment pouvons-nous vous aider ?

Recherche

Google Tag Manager Tracking

  • Mise à jour

Cet article vous explique comment mettre en œuvre Google Tag Manager dans votre site. Pour savoir comment créer des tags GA4 dans Google Tag Manager, consultez la documentation de Google.

Remarque

Google Analytics 4 remplace Universal Analytics. Le 1er juillet 2023, toutes les propriétés Universal Analytics standard cesseront de traiter les nouvelles occurrences. Les propriétés de 360 Universal Analytics cesseront de traiter les nouvelles occurrences le 1er juillet 2024. Pour savoir comment procéder à la migration, consultez la section Passer à Google Analytics 4.

This article does not follow Google’s instructions exactly, but have been tested and work correctly. The instructions have been changed from Google’s instructions for the following reasons:

  1. Google requiert d'installer le code dans la section <head> du site.  Cette pratique est pourtant déconseillée car elle ralentit le chargement du site. C'est pourquoi nous l'insérons dans la section <body-end>, au bas de la page, pour un chargement plus rapide.
  2. Remarque

    Nous vous recommandons de placer le code dans l'élément <body-end>, car même si Google Tag Manager se charge de manière asynchrone, le problème lié au chargement asynchrone est qu'il commencera tout de même à télécharger des ressources et à exécuter du code. Cette activité est en concurrence avec d'autres ressources du téléphone/de l'ordinateur pour la bande passante, l'utilisation du processeur, etc. Si vous placez le code dans l'élément <head>, vous lui donnez toujours la priorité sur d'autres ressources que le navigateur pourrait vouloir télécharger, comme : le style et la mise en page du site, le contenu principal, les images qui se trouvent au-dessus de la ligne de flottaison, etc.

    Website Builder a toujours constaté que les sites Web qui placent le code GTM dans l'élément <head> fonctionnent moins bien que ceux qui ne le font pas. Nous avons optimisé notre site pour donner la priorité au contenu visible, conformément aux signaux Web essentiels (Core Web Vitals) et aux indicateurs connexes FCP et LCP.

  3. It is easier to copy code into a single location.

Add Google Tag Manager

Google donne des codes d'intégration que ressemblent aux exemples ci-dessous. Ces deux éléments doivent être installés dans la section <body-end> du site. Pour localiser l'élément <body-end> du site, rendez-vous dans le panneau latéral de l'éditeur et cliquez sur Paramètres, puis sur HTML de l'en-tête.

Remarque

The below code is just an example - do not copy this directly into your site. Please be sure to obtain the correct code from Google.

Section Script

 
<!-- 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-XXXX');</script>
<!-- End Google Tag Manager -->

Section NoScript

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Set Up Google Tag Manager

Attention

This step is critical in allowing Google Tag Manager tracking inside your site.

Next, we need to replace the default All Pages page view trigger with our custom event. Inside of tag manager, we need to first create the custom event trigger:

  1. Go to Google Tag Manager and sign in.
  2. On the left, click Triggers.
  3. On the right side, click the new button.
  4. Type a name for the trigger at the top left. We recommend something memorable and helpful, such as: Custom Page View Trigger.
  5. Click the custom trigger configuration box and select Custom Event.
  6. In the event name box, type dPageView.
  7. Cliquez sur enregistrer dans Tag Manager.

Une fois le déclencheur créé, nous devons l'appliquer aux tags concernés. Cette étape doit être réalisée pour chaque tag utilisé sur votre site pour déclencher les événements de visualisation de page. Dans cet exemple, nous l'appliquons à Google Analytics Universal, mais Google Analytics 4 est la version la plus récente que nous vous recommandons d'utiliser. Pour savoir comment créer et appliquer des déclencheurs à des tags GA4 dans Google Tag Manager, consultez la documentation de Google.

  1. In Tag Manager, go to tags.
  2. Create a new tag.
  3. Type a memorable name.
  4. Click the Tag Configuration box and select the tag you want to use. In this case, Google Analytics Universal.
  5. Une fois le tag configuré, cliquez sur Déclenchement. Sélectionnez le déclencheur personnalisé que nous venons de créer : Custom Page View Trigger.

    6. Remarque

    If there’s already the All Pages trigger applied, please delete it. We only need the custom trigger to run.

  6. Sélectionnez une nouvelle variable.
  7. Sélectionnez Paramètres Google Analytics.
  8. Saisissez votre identifiant de suivi GA, puis nommez votre variable en haut de l'écran.
  9. Sélectionnez la variable et cliquez sur Enregistrer.

After you have made these changes to Tag Manager, click Submit and then Publish the changes to the live settings.

Considerations for Google Tag Manager

  • This code will only run on the live published site. You will want to make sure you test it on the live version.
  • Nous avons effectué de nombreux tests, et nous précisons que la section body-end.html du mode développeur permet d'ajouter le code « noscript » et le code par défaut.
  • Please do not change the ‘dataLayer’ setting from Google Tag Manager, this will break our custom integration code.