Fermer

septembre 19, 2023

Comment charger correctement plusieurs ID de conteneur Google Tag Manager

Comment charger correctement plusieurs ID de conteneur Google Tag Manager


Autant que Google le vante vitesse des pages comme mesure de performance critique lors de la détermination de l’expérience utilisateur et de son impact en tant que facteur de classementc’est assez ironique puisque leurs propriétés sont ridiculement lentes.

Script typique de Google Tag Manager

La mise en œuvre typique de Gestionnaire de balises Google vous oblige à charger deux scripts, un dans la tête et un à la fin du corps. Exemple:

En haut de la balise :

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

Après la balise :

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

Cependant, certaines entreprises doivent charger plusieurs GTM conteneur et faites l’erreur de simplement ajouter les balises de script supplémentaires. Cette méthode fonctionne mais nécessite des HTTP demandes, impactant les performances globales du site. La méthode appropriée consiste à charger un seul script, puis à y transmettre plusieurs ID de conteneur.

Script Google Tag Manager pour plusieurs conteneurs

Vous devrez renoncer au code standard copier-coller fourni par Google Tag Manager lors de la transmission de plusieurs ID de conteneur. Dans l’exemple de code suivant, je charge deux ID de conteneur différents à partir de Google Tag Manager :

En haut de la balise :

<!-- Google Tag Manager -->
<script>
  dataLayer = {
    'gtm.start': {
      'GTM-XXXXXXX': true,
      'GTM-YYYYYYY': true
    }
  };
</script>
<!-- Google Tag Manager script -->
<script src="https://www.googletagmanager.com/gtag/js"></script>
<script>
  gtag('js', {
    'gtm.start': dataLayer['gtm.start']
  });
</script>
<!-- End Google Tag Manager -->

Après la balise :

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

Si vous disposez de plus de deux ID de conteneur, ajoutez leurs ID de conteneur dans le tableau dataLayer dans votre balise head et ajoutez-le, délimité par des virgules, au chemin iframe dans le corps.

Gardez à l’esprit que cela ne fait pas gagner beaucoup de temps. Au fur et à mesure de l’exécution du script, il doit toujours déclencher les balises de chacun de vos comptes Google Tag Manager. Cependant, cela vous évite l’aller-retour lors de l’exécution de chaque script et de chaque requête pour le script initial.




Source link

septembre 19, 2023