Hub'Sales, Web Analytics

Comment utiliser un dataLayer sous Google Tag Manager ?

Data quoi ? dataLayer ? Vous avez peut être déjà entendu ce mot barbare. Qu’est-ce que cela signifie ? Comment s’en servir ? À quel moment ? Où doit-il être implémenté ? Comment le configurer avec Google Tag Manager ? C’est au travers de cet article, qui sera court mais précis, que je vais répondre à toutes ces questions. Commençons par une brève définition.

Comment définir un datalayer ?

Le « data Layer » se traduit en français par « couche de données ». C’est un objet JavaScript qui contient toutes les informations que vous passez dans Google Tag Manager (GTM). Cet objet, vous aide à remonter des informations particulières de votre page vers GTM (transactions, comportement des internautes sur un site Web, comportement sur mobile, etc.). Il se compose de variables définies par des paires de noms et de valeurs. Mais que faire d’une simple définition ? Visualisez donc ci-dessous un exemple d’un dataLayer. Vous constatez que les variables typePage et typeVisiteur sont bien définies par des valeurs (formulaire et prospect), le tout dans une jolie petite balise  JavaScript. Jusque là tout va bien ! Je suis persuadée que vous me suivez encore. 🙂 Passons à l’étape suivante : où implémenter le dataLayer dans un code HTML ? [code lang= »html »]<script> var dataLayer = [{ ‘typePage’ : ‘formulaire’, ‘typeVisiteur’ : ‘prospect’ }]; </script> [/code]

Où implémenter un datalayer ?

Entre l’ouverture de la balise BODY et le script Google Tag Manager. Pourquoi avant le script GTM ? Comme défini précédemment, le dataLayer contient toutes les informations que vous souhaitez passer dans votre tag management system. Il faut donc que ces informations se téléchargent avant le script GTM, pour qu’elles soient transférées dans son interface et dans vos outils analytics. Tout simplement.Si vous placez votre dataLayer après votre code GTM, je doute fortement d’un résultat. 😉 L’alternative est de spécifier un dataLayer vide et de la remplir avec une action utilisateur ou la fin de la génération de la page par exemple Mais nous pourrons en parler dans un autre billet. Vous êtes toujours là ? J’en suis certaine ! Ne quittez pas l’article c’est là que ça devient intéressant. Après avoir compris ce qu’est un dataLayer, savoir correctement l’implémenter, il est temps d’apprendre à le paramétrer dans Google Tag Manager.  

Comment utiliser un datalayer avec Google Tag Manager ?

Lors de cette explication, j’ai tenu à garder comme exemple la variable de la capture d’écran précédente : typeVisiteur. Je vais faire comme si, je souhaitais que cette donnée soit remontée dans Universal Analytics. Toutefois, je ne vais pas expliquer comment implémenter le tag Universal Analytics dans Google Tag Manager. Si vous avez envie d’en connaître davantage sur l’implémentation de UA dans la nouvelle version de GTM, je vous conseille la lecture d’un autre de nos billets : Google Tag Manager v2. Dans notre cas, pour collecter « typeVisiteur», il faut créer une variable (qu’on appelle aussi macro dans la v1 de GTM – rien à voir avec Excel) qui sera utilisable dans la balise Universal Analytics. Je précise : à chaque fois que vous souhaitez collecter une variable de votre dataLayer, il faut déclarer une variable dans l’interface du tag management system. En clair : 1 variable dataLayer = 1 variable à créer dans Google Tag Manager. Pour créer cette variable, via la nouvelle version de GTM (pas encore traduite en français) : Variables > User-Defined Variables> Data Layer Variable. Image 2 Ensuite, configurez votre variable et cliquez sur « create variable » pour l’enregistrer. Le Data Layer Variable Name doit être le nom qui a été déclaré dans le script du data Layer. Dans mon exemple, étant donné que « typeVisiteur» est inscrit dans le script, c’est « typeVisiteur» qui sera en Data Layer Variable Name. DataLayer - image Et c’est pas fini ! Une fois la variable déclarée dans GTM, il faut dire à la balise Universal Analytics de s’en servir. Pour ça, vous devez suivre le chemin suivant : Tag > sélectionnez votre tag Universal Analytics > 4 Configure your tag > Custom Dimension > +Add Custom Dimension. En index, précisez le numéro correspondant à la dimension personnalisée. Ce numéro vous est donné, dans Universal Analytics, quand vous créez une dimension personnalisée. En Dimension Value, sélectionnez la variable que vous venez de définir. Dans mon exemple, la dimension personnalisée Type de visiteur était la première que je créais sous Universal Analytics. C’est pour cela que j’ai inscrit le numéro 1 dans Index. Image 4 Il ne vous reste plus qu’à :
  • ajouter une règle de déclenchement de ce tag (sur toutes les pages vues par exemple) ;
  • sauvegarder le tag ;
  • publier votre GTM ;
… et le tour est joué ! Vous récupérez dans Google Universal Analytics des informations sur votre typologie de visiteur ! J’espère que cet article vous a éclairé sur le dataLayer et sur son implémentation dans Google Tag Manager. Avez-vous déjà mis en place Google Tag Manager? Comment utilisez-vous votre dataLayer? Faites le nous savoir dans les commentaires! Si vous avez besoin d’aide pour Google Tag Manager ou pour une migration de Universal Analytics en passant par GTM, contactez Hub’Sales, notre agence partenaire certifié GTM.