Google Tag Manager : suivre les évènements (custom event tracking)

Franck Scandolera

google-tag-manager-syteme - custom event trakingVoici le deuxième article sur Google Tag Manager (GTM), le gestionnaire de balise de Google.  Dans Comprendre le Tag Manager System de Google (GTM), nous avons passé en revue les concepts de base de GTM, dans ce post, nous allons commencer à appliquer l’une des caractéristiques les plus fréquemment utilisées -le suivi des évènements (custom event tracking) Google Analytics dans GTM.

Quand utiliser le suivi des évènements (event)

Lorsque vous voulez enregistrer autre chose que les pages vues comme les interactions des utilisateurs, vous utilisez le tracking des events. Par exemple, vous souhaitez suivre si un bouton spécifique est cliqué, ou si vous voulez savoir combien de personnes ont lu la vidéo sur votre site, vous pouvez utiliser le suivi des évènements.

Comment mettre en œuvre le suivi des évènements avec Google Analytics

Pour mettre en œuvre le suivi d’évènement vous devez avoir le code de tracking Google Analytics sur votre page. Puis appeler la fonction JavaScript suivante pour capter l’évènement :

_trackEvent(category, action, label, value, noninteraction)

Les paramètres sont les suivants:

  • Catégorie: Catégorie de l’évènement, par exemple, vidéo
  • Action: l’action de l’évènement, par exemple, lecture, pause, etc
  • Label (facultatif): label pour identifier votre évènement  par exemple le nom ou sujet de la vidéo
  • Valeur (en option): une valeur entière dans le cas où vous souhaitez fournir une valeur numérique pour l’évènement,
  • Non-interaction (facultatif): un indicateur booléen pour déterminer si cet évènement est inclus pour calculer le taux de rebond.

<a onclick="_gaq.push(['_trackEvent', 'video', 'lecture', 'Ma-video']);" href="#">Lire Ma-video</a>

 

Comment mettre en œuvre le suivi des évènements avec Google Tag Manager

En fait, même si vous utilisez GTM, vous pouvez toujours utiliser le _gaq.push mentionné ci-dessus tant que l’objet _gaq est présent dans le code de suivi Google Analytics chargé par le tag conteneur. Cependant, puisque nous sommes en voie de migration vers GTM, nous allons essayer de faire les choses à la façon de GTM.
Rappelez-vous dans l’article « Comprendre le Tag Manager System de Google (GTM) » , nous évoquons le 3 éléments clés de Google Tag Manager : les balises, les macros et les règles. Abordons-les un par un:

Macros GTM

Commençons par les macros. Comme mentionnés plus haut, pour tracker un évènement,   nous avons besoin de passer plusieurs variables (par exemple, la catégorie, l’action, le label, etc) à la fonction JavaScript « _trackEvent ».  Pour faire de même sur Google Tag Manager,    nous devons préalablement déclarer chaque variable dans une macro :
gtm-creer-macro-exemple-optimisation-conversion
Choisissez le type de macro « Variable de couche de données », nommez la macro de façon explicite par exemple « eventCategory » (Suggestions de noms pour les variables de couche de données) puis  enregistrez-la. Une fois les variables de tracking définis,  vous devez retrouver vos 5 macros dans la colonne de gauche comme ci-dessous :
gtm-macro-exemple-optimisation-conversion
 

Balises GTM

L’étape suivante consiste à créer la balise que la page chargera, dans notre cas, « Custom Event », il s’agit d’un type de balise « Google Analytics » avec le type de suivi  « Evènement ».
Une fois que vous avez sélectionné le type de suivi, vous verrez apparaître les  paramètres du suivi des évènements. Cliquez sur +{{macro}} au niveau des paramètres de suivi,  et  sélectionner les macros correspondantes dans le menu déroulant. Une fois terminée, l’interface de Google Tag Manager devrait ressembler à quelque chose comme çà :
gtm-balise-exemple-optimisation-conversion

Règles GTM

La dernière étape pour configurer notre GTM custom event tracking, est la création d’une règle pour déclencher la balise que nous avons créée. Supposons qu’à chaque fois que l’évènement « Event clic » est appelé par une page, nous devons charger notre balise « Custom Event ».
Pour créer une règle c’est également très simple, sur la page de création de balises, cliquez sur « Ajouter une règle pour déclencher la balise » et créer une nouvelle règle comme suit :
gtm-creation-regle-exemple-optimisation-conversion
Enregistrer la règle et la balise, voilà c’est terminé pour la configuration requise par Google Tag Manager ! Mais attendez … maintenant nous devons voir le déclencheur javascript pour tracker les évènements sur vos pages.

DataLayer GTM

La couche de données est un objet qui contient toutes les informations que vous souhaitez transmettre au  gestionnaire de balises Google.
Pour tracker un évènement au niveau de la page  :
Maintenant, imaginez que vous avez un site d’e-commerce que vous voulez envoyer à GTM le chiffre d’affaires total généré sur la page de confirmation, vous devrez définir un objet couche de données et d’associer les valeurs clés et correspondant par paires comme suit:

dataLayer = [{
'transactionTotal': '2000'
}];

C’est aussi simple que cela !
Ainsi, afin de déclencher la balise de l’évènement et transmettre les paramètres nécessaires à Google Analytics, nous avons juste besoin d’appeler la fonction Push de l’objet DataLayer comme ceci :

dataLayer.push({
'eventCategory': 'votre catégorie de l'évènement',
'eventAction': 'votre action de l'évènement',
'eventLabel': 'votre label de l'évènement',
'event': 'votre variable de déclenchement prédéfinit dans une Règle'
});

Pour tracker un évènement au niveau du clic  :
Par exemple sur formations-analytics.com, nous trackons le téléchargement de notre guide de formation Télécharger le guide des CRO Formations
Comme ceci :

<a onclick="dataLayer.push({
'event': 'telechargement',
'eventCategory': 'document',
'eventAction': 'telechargement',
'eventLabel': 'guide-formation',
'eventValue': '10'});" href="/wp-content/uploads/pdf/Formations CRO - Optimisation-conversion.com- v1-0.pdf" target="_blank">Télécharger le guide des CRO Formations</a>

Tout semble prendre forme ?
On utilise « telechargement » comme  valeur de « event », de sorte que la règle que vous avez définie soit validée pour activer la balise correspondante au moment de l’appel.
Nous passons à chaque paramètre de suivi, (vous reconnaissez les macros prédéfinies lors de la configuration) les valeurs que nous souhaitons. GTM collecte ces valeurs et les transmet à notre balise « Custom Event ».
Maintenant, connectez-vous à Google Analytics / Contenu / Evenement pour  observer vos performances !
Si vous utilisez Google Analytics, je vous conseille vivement  de migrer votre implémentation vers Google Tag Manager (si besoin je peux vous accompagner contactez-moi).
Pour plus d’information sur les Tag Manager, consulter les articles :
Comprendre le Tag Manager System de Google (GTM)
Tag Management Systems, TMS ou la gestion simplifiée de son plan d’implémentation.