Installation de Google Tag Manager sur Wordpress et suivi avancé Google Analytics

Bruno Guyot
Head of Digital Marketing
FirstPoint Sàrl – Lausanne
Bruno-guyot.com
Firstpoint.ch
Novembre 2016
Installation de Google Tag
Manager sur Wordpress et
suivi avancé Google Analytics

Créer un compte Google Tag
ManagerLe guide complet de Google Tag Manager pour Wordpress
Dans ce guide de plus de 11000 mots, vous apprendrez à :
• Paramétrer avec précision l’extention GTM Wordpress
• Avoir un suivi Google Analytics top niveau
• Suivre toutes les actions des visiteurs sur votre site
• Mettre en place le pixel Facebook et l’enrichir avec les
événements standards
• Mettre en place un suivi des conversions Adwords
avancé
Ces slides sont un condensé d’une partie de mon guide complet de l’utilisation de
Google Tag Manager avec Wordpress.
Consultez ce guide ici : http://www.chablais-web/google-tag-manager-wordpress.php

Au sommaire
•Créer et paramétrer le compte GTM
•Installer et paramétrer le plugin Wordpress
•Mettre en place le suivi Google Analytics
•Ajuster votre taux de rebond
•Mesurer les pages vues en entier
•Créer des dimensions personnalisées
•Créer un regroupement de contenu

Installation et configuration
de l’extension

ManagerCréer un compte Google Tag Manager
La 1ère étape est de créer le compte.
Idéalement à votre nom ou celui de
votre entreprise.
Notez que vous pouvez avoir
plusieurs containers dans un seul
compte.

ManagerCréer son 1er container Google Tag Manager
Vous créez ensuite le container pour
votre site web.
Un container pour un site web.
Si vous avez un autre site par
exemple, vous pourrez créer un autre
container dédié.

Après avoir accepté les conditions
d’utilisation, vous obtenez le code de
votre container.
Il faut maintenant l’installer sur votre
site.

Vous noterez au passage votre ID de
container Google Tag Manager.
Vous pouvez retrouver cet ID à tout
moment dans l’interface GTM en
haut à droite de votre écran.

ManagerInstaller le code sur votre site Wordpress
Pour accélérer grandement
l’intégration, nous allons utiliser
l’extension DuracellTomi’s Google Tag
Manager for Wordpress.
Vous téléchargez et installez
l’extension, puis renseignez votre ID
de compte GTM dans la case Google
Tag Manager ID. Choisissez ensuite le
placement Custom.

ManagerInstaller le code sur votre site Wordpress
En custom, vous devrez modifier le
fichier header.php afin d’y intégrer
l’extrait de code indiqué.
Vous ouvrez donc le fichier
header.php par votre FTP, vous
recherchez la balise <body> et vous
collez le code en dessous.

ManagerConfiguration avancée du plugin GTM for Wordpress – Basic Data
Les basic data vous permettent de
choisir les données que vous souhaitez
mettre dans le dataLayer au chargement
des pages
C’est à vous de voir ce dont vous avez
besoin, et comme vous le voyez, ci
contre, les options sont nombreuses.
Ces data seront ensuite récupérables
facilement dans GTM par des variables
et transmissibles à Google Analytics,
Adwords, Facebook, etc…

ManagerConfiguration avancée du plugin GTM for Wordpress – Events
Les événements sont des actions faites
par les visiteurs sur une page. La encore,
vous avez du choix.
A chaque événement, un objet sera créé
dans votre dataLayer, vous permettant
ainsi de vous en servir comme
déclencheur. Exemple ci-contre avec un
clic sur un lien externe.
N’activez que ce dont vous avez besoin.

ManagerConfiguration avancée du plugin GTM for Wordpress – Scroll Tracking
Cette option vous permet de gérer l’une
des plus grosses faiblesses de Google
Analytics et de passer au taux de rebond
ajusté.
Le détail de chaque champ est expliqué
en détail dans l’article source de ce
SlideShare :
http://www.chablais-web.fr/google-tag-
manager-wordpress.php#scroll-tracking

ManagerConfiguration avancée du plugin GTM for Wordpress – Blacklistage
Cette option vous permet de désactiver
l’exécution de certaines balises.
Par défaut, cette fonctionnalité est
désactivée. Et c’est très bien, je vous
invite à la laisser désactivée également.

ManagerConfiguration avancée du plugin GTM for Wordpress – Intégration
Cette partie Intégration vous permet
d’intégrer des modules populaires.
Exemple Contact Form 7. L’intégration
créera automatiquement un évènement
dataLayer lorsqu’un formulaire sera
envoyé.
Autres intégrations : e-commerce
amélioré Google Analytics et le
Remarketing Adwords. De gros gains de
temps la aussi.

Mise en place de Google Analytics

ManagerCréer la balise de suivi Google Analytics
1. Cliquez sur Balises
2. Cliquez sur le bouton « Nouvelle »
3. Cliquez ensuite sur le cadre
configuration de la balise

ManagerCréer la balise de suivi Google Analytics
4. Donnez-lui un titre. Exemple : GA – Suivi de base
5. Choisissez la 1ère balise de la liste (Universal)

ManagerCréer une constante pour votre identifiant Google Analytics
6. Au niveau de la case ID de suivi, cliquez sur le bouton + à droite.
7. Cliquez sur le + tout en haut à droite pour créer une nouvelle variable

ManagerCréer une constante pour votre identifiant Google Analytics
8. Nous allons appeler cette variable GA id. Elle sera de type constante
9. Collez votre identifiant Google Analytics (UA-XXXXX-X) et enregistrez votre
variable.

ManagerParamétrer la balise de suivi de base Google Analytics
10. De retour dans la balise, choisissez
maintenant la variable GA id dans la liste.
11. Laissez le type de
suivi de la balise sur
Page Vue et descendez
pour cliquez sur la partie
déclenchement

ManagerParamétrer la balise de suivi de base Google Analytics
12. Choisissez le déclencheur All Pages.
Enregistrez et le déclencheur et la
balise.
13. Cliquez sur la flèche en haut à droite pour dérouler
le menu et cliquez sur Prévisualiser.
Cette étape va nous aider à vérifier que la balise
Google Analytics se déclenche comme elle se doit sur
toutes les pages.

ManagerVérifier le déclenchement de votre balise de suivi Google Analytics
14. Vous êtes désormais en mode
prévisualisation. Ouvrez votre site
dans un nouvel onglet.
De là, une fenêtre s’ouvre en
surimpression. Si vous avez suivi les
étapes correctement, vous devez voir
qu’à chaque page, votre balise
Google Analytics est déclenchée.

ManagerPublier la balise de suivi Google Analytics
15. Retournez dans GTM et publiez.
16. Si vous aviez déjà un suivi Google
Analytics installé sur votre site sans
GTM, pensez bien à l’enlever !!

Aparté : apprendre à
visualiser votre dataLayer

ManagerSavoir regarder le dataLayer avec la console
Avant toute chose, vous devez savoir
comment regarder votre dataLayer.
L’un des moyens est de taper
dataLayer dans la console de votre
navigateur (ouvrez avec F12).
Cliquez ensuite sur la petite flèche
de gauche sous la ligne dataLayer
pour déplier les différents objets du
dataLayer et voir les variables et
événements de chaque objet.

ManagerSavoir regarder le dataLayer avec le debugger GTM
Une autre méthode pour voir votre dataLayer est d’utiliser la console de debug de GTM.
Attention : celle-ci n’est visible qu’en mode de prévisualisation.

Google Analytics avancé :
taux de rebond ajusté

ManagerAjuster votre taux de rebond Google Analytics
Commençons déjà par expliquer le principe.
La configuration mise en place dans la partie scroll tracking
du plugin, a pour résultat de créer un événement dataLayer
lorsque la page se charge : gtm4wp.reading.articleLoaded.
Il signifie ok, la page est bien chargée, dans X secondes, je
commence à chronométrer. X correspondant au nombre de
millisecondes paramétré dans l’onglet Scrolling du plugin.

Ensuite, le visiteur commence à scroller la page et arrive à la
limite des 150px qui a été définie dans le plugin pour envoyer
un second événement : gtm4wp.reading.startReading. Celui-
ci signifie que l’utilisateur commence à lire le contenu.
C’est cet événement qui va nous permettre de casser notre
taux de rebond.
Note : je passe rapidement mais tout est expliqué de manière beaucoup plus précise et
profonde dans l’article source :
http://www.chablais-web.fr/google-tag-manager-wordpress.php

Nous allons maintenant créer
un événement Google
Analytics qui se déclenchera
au moment ou l’événement
gtm4wp.reading.articleLoaded
survient.
Cet événement GA sera une
interaction et par conséquent,
fini le taux de rebond.

Comme déclencheur, nous
utilisons l’événement
gtm4wp.reading.articleLoaded.
Pour ce faire, descendez plus
bas sur la page et cliquez sur le
cadre Déclenchement.
Théoriquement, vous ne voyez
que pages vues. Il va donc
falloir créer un nouveau
déclencheur. Pour cela, cliquez
sur le « + » en haut à droite

Vous allez le nommer Début de
lecture, choisir que c’est un
événement personnalisé et
définir sa valeur :
gtm4wp.reading.articleLoaded.
En condition, laissez tous les
événements .
Enregistrez votre déclencheur, puis votre balise. Le tour est joué.

Vous pouvez maintenant prévisualiser :
Rendez-vous sur votre site. Rechargez une
page, scrollez un peu. Vous devez voir la
balise Taux de rebond ajusté se déclencher.
Vous pouvez retourner à GTM et publier.

Google Analytics avancé : Mesurer
les pages vues en entier
et en faire un objectif

ManagerMesurer les pages vues en entier dans Google Analytics
Commençons déjà par expliquer le principe.
Lorsqu’un visiteur atteint le bas d’une page, le plugin
génère un nouvel évènement dataLayer :
gtm4wp.reading.contentBottom.
C’est cet événement qui va nous permettre de mesurer le
nombre de pages vues en entier.

Dans GTM, créez une
nouvelle balise Google
Analytics.
C’est la même chose que ce
que l’on a fait pour le taux de
rebond ajusté. Seul
l’événement change.
Configurez-la comme ci-
contre.

Il faut ensuite créer un
nouveau déclencheur pour
cette balise.
Il aura pour nom Pied de page
atteint et la valeur
gtm4wp.reading.pagebottom.

Vous pouvez maintenant prévisualiser :
Rendez-vous sur votre site. Allez en bas de
page. Vous devez voir la balise Evénement
pied de page atteint se déclencher. Vous
pouvez retourner à GTM et publier.

ManagerFaire des pages vues en entier un objectif dans Google Analytics
Maintenant nous allons
créer un objectif dans
Google Analytics (qui
comptera une conversion
à chaque fois que cet
événement est
déclenché).
Cet objectif nous donnera un nouvel indicateur pour jauger la qualité de votre trafic. Et
par exemple pouvoir comparer plusieurs sources de trafic. Ou différentes campagnes.

Vous créez un nouvel objectif. Dans la liste des choix proposés, vous choisissez
personnalisé (tout en bas) et vous validez.
Ensuite, vous donnez un
nom à votre objectif
(Contenu vu en entier) et
en type, vous choisissez
événement. Enfin, vous
renseignez exactement les
mêmes valeurs de catégorie
et action renseignées dans
la balise GTM :

Vous pouvez également (comme je l’ai fait) donner une
valeur à votre objectif. Je vous encourage à le faire, ne
serait-ce que pour pouvoir comparer la valeur par page.
Vous n’avez plus qu’à enregistrer votre objectif et voilà.
Vous pouvez également vérifier que
tout fonctionne dans les rapports
Temps réel :

Google Analytics avancé : Mise en
place de dimensions personnalisées

ManagerMise en place de dimensions personnalisées dans Google Analytics
Commençons par expliquer le principe.
1) Identifier sur votre site une information qui peut avoir plusieurs résultats. Par
exemple, en e-commerce, ça pourrait être état de stock (en stock, en rupture, dernières
pièces), le nombre d’étoiles par produit, etc… Pour un blog : l’auteur de l’article, l’année
de publication, la catégorie de l’article, etc...
2) Envoyer la valeur dans le dataLayer. Là c’est facile, le plugin le fait pour nous. On
choisit ce qu’on veut dans l’admin du plugin.
3) Récupérer la valeur placée dans le dataLayer dans une variable GTM.
4) Envoyer cette variable à Google Analytics en dimension personnalisée.

Disons que l’on veuille l’année de l’article.
Jetons un œil au dataLayer pour voir comment
s’appelle la variable qui nous intéresse. Elle
s’appelle pagePostDateYear :
Il faut donc, (et ce sera toujours le même principe) la récupérer en variable de couche
de données dans GTM.

On crée donc une nouvelle
variable personnalisée de type
couche de données qu’on va
appeler Année de création et qui
aura pour valeur
pagePostDateYear :

On va donc dans
l’admin de Google
Analytics, et dans
la colonne
Propriété, on aller
cliquer sur
Définitions
personnalisées
puis sur
dimensions
personnalisées.

Ensuite, on va
créer la
dimension dans
Google Analytics
afin d’obtenir
l’index. Cette
dimension sera de
portée hit puisque
c’est une donnée
qui change à
chaque page.

Enregistrez votre
dimension et retournez
dans GTM.
Là vous rouvrez la balise
Google Analytics (GA –
Suivi de base) pour
l’insérer dans les
champs de dimensions
personnalisées.

Et voila. Vous pouvez publier.
Cet ajout vous permettra de pouvoir comparer vos pages par année de création. Vous
pourrez même, dans un rapport personnalisé, comparer vos données par année de
publication :

Notez que nous aurions très bien pu obtenir quelque chose de très similaire avec un
regroupement de contenu. Nous allons voir ça juste après. Mais avant, récapitulons
juste le principe :
• On identifie la variable dans le dataLayer
• On la récupère en variable personnalisée de couche de données dans GTM
• On crée une dimension personnalisée dans Google Analytics pour obtenir l’index
• On ajoute l’index et la variable à la balise de suivi de base de Google Analytics.
Nous avons pris l’exemple de l’année de création mais il y a plein plein de possibilités.
Soyez créatifs et gagnez en analyse !

Google Analytics avancé : Mise en
place d’un regroupement de contenu

ManagerMise en place d’une regroupement de contenu dans Google Analytics
Comme toujours, commençons par le
principe. Un regroupement de
contenu permet d’analyser vos
contenus selon une logique différente
de ce qui est proposé par défaut.
Cela permet par exemple d’analyser la
performance d’articles par
thématique. Sur mon blog j’en traite
plusieurs : google tag manager, google
analytics, google adwords, e-
commerce, emailing, etc…

Le content grouping permet de créer des étiquettes globales dans lesquelles nous
allons pouvoir ranger les différents articles des différentes thématiques pour pouvoir
comparer les performances. Le principe en image :

Nous allons mettre en place un regroupement de contenu en utilisant la catégorie de la
page, une variable que le plugin met à notre disposition. C’est l’une des possibilités
possibles. Mais il y en a plein d’autres. La aussi, soyez créatifs !
Pour notre exemple, identifions
la variable qui nous intéresse
dans le dataLayer. Elle s’appelle
pageCategory :

Mais on va avoir un problème. C’est un tableau. (C’est un cas relativement rare). Du
coup, si l’on récupère la valeur de pageCategory, on va obtenir un tableau, et ce sera
pas terrible pour nos rapports Analytics.
Dans le cas présent, la valeur de la dimension serait blog, google-tag-manager. Imaginez
si nous avions des articles rattachés à 3 ou 4 catégories !
Il va donc falloir aller récupérer la valeur 1 qui seule nous intéresse. Il se trouve qu’il y a
une manière de faire bien particulière.

Rendez-vous dans GTM et
créez une nouvelle variable
définie par l’utilisateur. Elle
sera de type couche de
données et s’appellera
Catégorie de l’article.
Et sa valeur ne sera pas
pageCategory mais
pageCategory.1, afin de
récupérer juste l’entrée du
tableau qui nous intéresse :

On enregistre
et on vérifie en
mode débug
que notre
manip a bien
fonctionné et
que l’on
récupère la
bonne valeur.

Passons à l’étape 2, passer la variable à Google Analytics. Et finalement, ça ressemble
beaucoup aux dimensions personnalisées.
On va devoir la aussi aller chercher une valeur d’index. Donc allez dans Google
Analytics, dans l’admin, au niveau du regroupement de contenu :

Vous cliquez sur le bouton ok
puis vous enregistrez.
Maintenant, vous retournez
dans GTM, vous reprenez
votre balise de suivi Google
Analytics de base et vous allez
dans plus de paramètres >
Regroupement de contenu
afin de renseigner l’index et la
variable :

Vous enregistrez votre
balise et voila.
Par acquis de conscience,
on peut vérifier que cela
fonctionne bien par la
console de debug.
Ca fonctionne, la donnée
est bien passée, vous
pouvez publier votre
container.

Attendez quelques
jours et vous pourrez
profiter de rapports
enrichis vous
permettant d’analyser
votre contenu sous un
angle jusqu’alors
impossible :

Notez que vous pouvez avoir plusieurs groupes de contenu. Moi par exemple, j'aime
aussi en faire un pour le type de page (article vs page).
Pour la mise en place c'est facile, nous avons une variable pagePostType dans le
dataLayer :-)

Aller plus loin
• Utilisations avancées du Tag Manager
• Formation
• Taggage de votre site

ManagerUtilisations avancées du Tag Manager
Google Tag Manager permet d’aller très très loin au niveau de ce qui peut être suivi
et/ou extrait sur un site web ou une application mobile. Quelques exemples :
• Remontée dynamique d’éléments nécessaires au remarketing dynamique sur
Facebook et Google
• Mise en place de tracking avancés : clics sur les liens externes, vues de vidéo,
téléchargement de brochures, suivi de conversations tchat, etc…
• Mise en place dynamique d’éléments dans vos pages : balise canonical, Schema
markup par le biais d’un Json-ld dans le header, etc…
Je rédige régulièrement des articles sur le sujet. Suivez-moi pour rester informé :
https://ch.linkedin.com/in/bruno-guyot-firstpoint
https://twitter.com/ChablaisWeb

ManagerFormation
Je dispense des formations de
niveau débutant à avancé sur
Google Tag Manager.
Sur place (dans vos locaux) ou à
distance (session skype +
teamviewer).

ManagerTaggage de votre site
Vous savez que Google Tag
Manager est l’outil qu’il vous faut
sur votre site mais vous n’avez pas
envie ou pas le temps de le faire
vous-même ?
Je m’en occupe pour vous 

Merci pour votre intérêt
Vous avez appris des choses? Partagez !

Installation de Google Tag Manager sur Wordpress et suivi avancé Google Analytics

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

Similaire à Installation de Google Tag Manager sur Wordpress et suivi avancé Google Analytics

Similaire à Installation de Google Tag Manager sur Wordpress et suivi avancé Google Analytics (20)

Plus de Bruno Guyot

Plus de Bruno Guyot (7)

Installation de Google Tag Manager sur Wordpress et suivi avancé Google Analytics