Dans ces slides, vous apprendrez étapes par étapes comment tagger votre site e-commerce Prestashop avec Google Tag Manager afin de pouvoir utiliser le remarketing dynamique sur Facebook pour vos produits : les dynamic Product Ads. Ce guide est un condensé d’une partie de mon guide complet de l’utilisation de Google Tag Manager avec Prestashop que vous pouvez trouver ici : http://www.chablais-web/google-tag-manager-ecommerce-prestashop.php

1. Bruno Guyot
Head of Digital Marketing
FirstPoint Sàrl – Lausanne
Bruno-guyot.com
Firstpoint.ch
Novembre 2016
Tagger son Prestashop
avec Google Tag Manager
pour le remarketing
dynamique Facebook
30 étapes pas à pas
En 22 étapes

2. Créer un compte Google Tag
ManagerLe guide complet de Google Tag Manager pour Prestashop
Dans ce guide de plus de 6000 mots, vous apprendrez à :
• Paramétrer le suivi du e-commerce amélioré
• Paramétrer le remarketing dynamique Google
• Créer des campagnes remarketing dynamique Google
• Paramétrer le remarketing dynamique Facebook
• Créer des campagnes remarketing dynamique Facebook
Ces slides sont un condensé d’une partie de mon guide complet de l’utilisation de
Google Tag Manager avec Prestashop.
Consultez ce guide ici : http://www.chablais-web/google-tag-manager-ecommerce-
prestashop.php

3. Au sommaire
• Pré-requis
• Installer le Pixel Facebook de base
• Installer les évènements standards
• Définir un séquençage des balises

4. Créer un compte Google Tag
ManagerPré-requis
Pour pouvoir suivre ce tuto, vous
devez avoir Prestashop 1.6 avec le
module Google Tag Manager
Enhanced Ecommerce (UA) Tracking
correctement paramétré.
Pour le détail pas à pas de
l’installation, suivez mon guide à
l’adresse suivante :
http://www.chablais-web/google-
tag-manager-ecommerce-
prestashop.php

5. Créer un compte Google Tag
ManagerObtenir le pixel Facebook de base
1. Rendez-vous dans votre Business Manager : https://business.facebook.com
2. Déployez le menu et cliquez sur Pixels.

6. Créer un compte Google Tag
ManagerObtenir le pixel Facebook de base
3.Assurez-vous d’être sur le bon
compte publicitaire et cliquez sur le
Bouton Actions.
Créez votre pixel ou affichez son code
(si déjà créé).
Copiez le code donné par Facebook,
nous allons aller le mettre dans une
balise GTM.

7. Créer un compte Google Tag
ManagerCréer une balise avec le pixel de base
4. Rendez-vous dans Google Tag
Manager.
Créez une nouvelle balise de type
HTML personnalisé. Appelez-la
« Facebook – Pixel de base » et collez
le code de votre Pixel.
Enregistrez et choisissez un
déclencheur de type All Pages. Votre
pixel de base est maintenant présent
sur toutes vos pages.

8. Créer un compte Google Tag
ManagerCompléter le pixel de base avec les évènements standards
Maintenant, nous allons ajouter de nouvelles balises qui visent à compléter ce suivi de
base en fonction de comportements du visiteur : a-t-il vu un produit ? l’a-t-il ajouté au
panier? l’a-t-il acheté ?
Ces ajouts sont ce que Facebook appelle des événements standards. Le « hic » c’est
qu’en plus d’indiquer à Facebook un événement (produit vu, produit ajouté au panier,
produit acheté), il va aussi falloir lui indiquer de quel(s) produit(s) l’on parle. Il va donc
falloir lui envoyer les paramètres dynamiquement.
Attention : nous allons monter d’un cran au niveau technique. Soyez attentif. 

9. Créer un compte Google Tag
ManagerRécupérer les variables dynamiques dans le dataLayer
D’après Facebook, nous avons besoin
de :
• L’ID produit (attention, doit
correspondre à l’ID de votre flux
produit) => content_ids
• Son prix => value
• Sa catégorie => content_category
• Sa devise => currency
• La phase du tunnel (page produit,
panier ou achat) => content_name

10. Créer un compte Google Tag
ManagerRécupérer les variables dynamiques dans le dataLayer
Regardons ce que l’on a dans le
DataLayer.
5. Sur une fiche produit, ouvrez
l’inspecteur Chrome en inspectant un
élément au hasard. Cliquez ensuite
sur l’onglet Console.
De là, tapez dataLayer puis tapez sur
entrée. Vous allez obtenir le contenu
actuel de votre dataLayer.

11. Créer un compte Google Tag
ManagerRécupérer les variables dynamiques dans le dataLayer
6. Déplier les objets. Bonne nouvelle.
Le DataLayer contient les infos que
nous voulons.
Nous allons donc pouvoir créer des
variables de couche de données pour
récupérer ces informations et nous
pourrons ensuite nous en servir dans
les balises Facebook.

12. Créer un compte Google Tag
ManagerCréer les variables de couche de données nécessaires aux évènements
7. Retournez dans Google Tag Manager. Cliquez sur Variables puis Nouvelle.
Commençons par la 1ère, currencyCode. Ce sera une variable de type couche de
données.

13. Créer un compte Google Tag
ManagerCréer les variables de couche de données nécessaires aux évènements
8. Il faut maintenant faire la
même chose pour category, id
et price.
Maintenant que toutes les infos
qui nous intéressaient sont
récupérées dans des variables,
nous allons pouvoir définir nos
balises Facebook
additionnelles.

14. Créer un compte Google Tag
ManagerCréer la balise ViewContent
Vous trouverez le code des
événements standards ici :
https://www.facebook.com/business/h
elp/952192354843755?helpref=faq_co
ntent#addeventcode.
Nous, ceux qui nous intéressent sont :
ViewContent, AddToCart et Purchase.
Commençons par ViewContent.

15. Créer un compte Google Tag
ManagerCréer la balise ViewContent avec les variables de couche de données
9. Retournons dans GTM et créons une
nouvelle balise HTML personnalisée.
Copiez le code de l’évènement
ViewContent ici :
https://developers.facebook.com/docs/m
arketing-api/facebook-pixel/v2.8 et collez
le dans votre balise.

16. Créer un compte Google Tag
ManagerCréer la balise ViewContent avec les variables de couche de données
10. Remplacez les éléments notés en
exemple par les variables de couches de
données créées précédemment.
Pour une explication détaillée de la
syntaxe et de chacune des lignes de ce
code, n’hésitez pas à vous reportez à
l’article original ici : http://www.chablais-
web/google-tag-manager-ecommerce-
prestashop.php

17. Créer un compte Google Tag
ManagerCréer une déclencheur pour la balise ViewContent
Tout ce qu’il reste à faire maintenant
c’est de définir un déclencheur.
Sur quelles pages veut-on que cette
balise se déclenche ? Evidemment,
dès qu’un visiteur voit une fiche
produit.
11. Créez un nouveau déclencheur «
vue de fiche produit » . Il sera de
type page vue.

18. Créer un compte Google Tag
ManagerCréer une condition de déclenchement avec PageCategory
Nous ne voulons pas que la balise se déclenche
sur toutes les pages. Cliquez donc sur certaines
pages vues. Enfin, il va falloir définir une
condition.
Nous allons nous baser sur la variable
PageCategory que nous avions vu un peu plus tôt
dans le Datalayer pour définir la condition.
(Explication détaillée du pourquoi dans l’article
original).

19. Créer un compte Google Tag
ManagerCréer une condition de déclenchement avec PageCategory
Donc dans la première case de
condition, faites défiler jusqu’en
bas pour trouver « nouvelle
variable ».
12. Créez une nouvelle variable de
couche de données
« pageCategory ».
Enregistrez-la et retournez à votre
condition.

20. Créer un compte Google Tag
ManagerCréer une condition de déclenchement avec PageCategory
13. Vous n’avez plus qu’à définir que vous souhaitez un déclenchement lorsque
pageCategory est égal à product.
14. Enregistrez. Nous avons terminé avec la première balise additionnelle de Facebook.

21. Créer un compte Google Tag
ManagerCréer une balise pour l’évènement addToCart
Créons maintenant la 2ème balise. Celle
à déclencher au moment ou les
personnes mettent un produit au
panier.
15. Dans GTM, cliquez sur Nouvelle
balise. Appelez-la « Facebook – Pixel –
addToCart » . A l’intérieur, collez le code
de l’évènement AddToCart trouvé ici :
https://developers.facebook.com/docs/
marketing-api/dynamic-product-
ads/product-audiences/v2.8#setuppixel

22. Créer un compte Google Tag
ManagerCréer une balise pour l’évènement addToCart
Enrichissez-la avec les
paramètres facultatifs pour
lesquels nous avons créer des
variables.
Vous remarquez que c’est le
même code que la balise
viewContent si ce n’est que
viewContent a été remplacé par
AddToCart. Sinon c’est
exactement pareil.

23. Créer un compte Google Tag
ManagerCréer un déclencheur pour la balise d’évènement addToCart
Ensuite nous allons paramétrer le
déclencheur. Nous suivons le même
raisonnement que précédemment.
La différence c’est que lorsque l’on est sur la
page panier, pageCategory est égal à order.

24. Créer un compte Google Tag
ManagerCréer un déclencheur pour la balise d’évènement addToCart
16. Créez un nouveau déclencheur « Vue de panier » et qui aura pour condition
pageCategory est égal à order.
Maintenant passons à la dernière balise, celle qui correspond à l’achat.

25. Créer un compte Google Tag
ManagerCréer une balise pour l’évènement Purchase
17. De nouveau, créez une
nouvelle balise HTML
personnalisée « Facebook
– Pixel – Purchase ».
A l’intérieur, collez le code
de l’évènement Purchase.
Enrichissez-la avec les
paramètres facultatifs
pour lesquels nous avons
créer des variables.

26. Créer un compte Google Tag
ManagerConfigurer le déclenchement de la balise Purchase
18. Une nouvelle fois, nous allons créer un déclencheur
en fonction de la valeur de PageCategory mais cette fois
sur la page de confirmation de commande.
19. Finalisez votre
déclencheur pour
PageCategory égal à
orderconfirmation et
enregistrez.

27. Créer un compte Google Tag
ManagerPrévisualiser, débugger et publier son conteneur
20. Et voilà. Vous n’avez plus qu’à publier votre
conteneur. Prévisualisez avant afin de vérifier si :
• La balise du pixel de base se déclenche bien
sur toutes les pages?
• La balise ViewContent se déclenche lorsque
l’on visite une fiche produit?
• La balise addToCart se déclenche lorsque l’on
consulte le panier ?
• La balise Purchase se déclenche lorsque l’on a
validé une commande ?
Tout est bon ? Publiez !

28. Créer un compte Google Tag
ManagerVérifier les évènements au niveau du Pixel
Un bon moyen de vérifier que cela fonctionne c’est de regarder votre page pixel au bout
de quelques minutes (ou quelques heures, selon votre trafic). Théoriquement, vous
devriez avoir quelque chose comme ci-dessus.

29. Créer un compte Google Tag
ManagerParamétrer le séquençage des balises Facebook entre elles
Un dernier point important.
Désormais, GTM vous permet de définir
l’ordre dans lequel vos balises doivent se
déclencher.
Et cela tombe bien puisque nos balises
d’évènements ne doivent être déclenchées
avant le pixel de base. On ne le veut pas
parce que si c’était le cas, ça ne
fonctionnerait pas, tout simplement.

30. Créer un compte Google Tag
ManagerParamétrer le séquençage des balises Facebook entre elles
On va donc prendre nos 3 balises
les unes après les autres et les
paramétrer de sorte à ce qu’elles
ne se déclenchent que si la balise
Pixel de Base a déjà été
déclenchée.
21. Pour cela, on va dans la balise,
disons ViewContent. On déplie les
paramètres avancés puis le
séquençage des balises.

31. Créer un compte Google Tag
ManagerParamétrer le séquençage des balises Facebook entre elles
Et on va définir que l’on veut que
l’on veut déclencher une balise
avant le déclenchement de celle-
ci, en l’occurrence la balise du
suivi de base.
Et on peut même aller plus loin en
disant que si la balise du Pixel de
base n’est pas déclenchée, on ne
déclenche pas celle-là.
22. Vous n’avez plus qu’à faire de même pour les 2 autres balises d’évènement.

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

33. Créer un compte Google Tag
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

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

35. Créer un compte Google Tag
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 

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