suivi du e-commerce amélioré pour prestashop avec google tag manager

31
Bruno Guyot Head of Digital Marketing FirstPoint Sàrl – Lausanne Bruno-guyot.com Firstpoint.ch Novembre 2016 Suivi du E-commerce amélioré avec Prestashop et Google Tag Manager 30 étapes pas à pas

Upload: bruno-guyot

Post on 06-Jan-2017

2.054 views

Category:

Marketing


3 download

TRANSCRIPT

Page 1: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Bruno Guyot

Head of Digital Marketing FirstPoint Sàrl – Lausanne

Bruno-guyot.comFirstpoint.ch

Novembre 2016

Suivi du E-commerce amélioré avec Prestashop

et Google Tag Manager

30 étapes pas à pas

Page 2: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

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

Page 3: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Au sommaire

• Paramétrer GTM• Installer GTM sur Prestashop• Installer Google Analytics par GTM• Configurer le e-commerce amélioré

Page 4: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer un compte Google Tag Manager

Rendez-vous à l’adresse https://tagmanager.google.com

1. Créez votre compte. Idéalement à votre nom ou celui de votre entreprise.

Notez que vous pouvez avoir plusieurs containers dans un seul compte.

Page 5: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer son 1er container Google Tag Manager

2. 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é.

Page 6: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer son 1er container Google Tag Manager

3. Après avoir accepté les conditions d’utilisation, vous obtenez le code de votre container.

Il faut maintenant l’installer sur votre site.

Page 7: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer son 1er container Google Tag Manager

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.

Page 8: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerInstaller le code sur votre site Prestashop

Je vous recommande d’installer GTM avec le module Google Tag Manager Enhanced Ecommerce (UA) Tracking.

4. Vous l’achetez, le téléchargez et l’installez, puis vous créez les nouveaux hooks nécessaires. C’est facile, le module le fait automatiquement.

Page 9: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerConfigurer le module GTM Prestashop

5. Maintenant, renseignez votre identifiant GTM puis activez les paramètres de remarketing. Cela vous servira lorsque vous souhaiterez activer le remarketing dynamique Google.

Plus d’infos sur ce dernier point ici : http://www.chablais-web.fr/google-tag-manager-ecommerce-prestashop.php

Page 10: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer la balise de suivi de base Google Analytics

6. Allez dans Google Tag Manager

7. Cliquez sur Balises

8. Cliquez sur le bouton « Nouvelle »

9. Cliquez ensuite sur le cadre configuration de la balise

Page 11: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer une constante pour votre identifiant Google Analytics

1. Cliquez sur Balises2. Cliquez sur le bouton « Nouvelle »3. Cliquez sur le petit crayon dans le cadre

configuration de la balise

10. Donnez-lui un titre. Exemple : GA – Suivi de base

11. Choisissez la 1ère balise de la liste (Universal)

Page 12: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer une constante pour votre identifiant Google Analytics

12. Au niveau de la case ID de suivi, cliquez sur le bouton + à droite.

13. Cliquez sur le + tout en haut à droite pour créer une nouvelle variable

Page 13: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerCréer une constante pour votre identifiant Google Analytics

14. Nous allons appeler cette variable GA id. Elle sera de type constante

15. Collez votre identifiant Google Analytics (UA-XXXXX-X) et enregistrez.

Page 14: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer la balise de suivi de base Google Analytics

16. De retour dans la balise, choisissez maintenant la variable GA id dans la liste.

17. Laissez le type de suivi sur Page vue. Dépliez les options supplémentaires et activez les fonctionnalités avancées de commerce électronique et l’utilisation de la couche de données.

Page 15: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer la balise de suivi de base Google Analytics

13. Au niveau de l’ID de suivi, choisissez GA id dans la liste

18. Cliquez sur le cadre Déclenchement. Il va falloir créer un nouveau déclencheur. Pour cela, cliquez sur le « + » en haut à droite

Page 16: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer la balise de suivi de base Google Analytics

19. Cliquez sur le cadre configuration du déclencheur. Vous lui donnez le nom gtm.dom puis vous choisissez le type évènement personnalisé.

Page 17: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer la balise de suivi de base Google Analytics

20. Renseignez gtm.dom dans la case du nom de l’événement et enregistrez

Page 18: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer le suivi de l’ajout au panier avec Google Analytics

Nous avons terminé la configuration du suivi de base. Nous devons maintenant activer l’ajout au panier.

21. Créez une nouvelle balise Universal Analytics de type Evènement et configurez la comme comme indiqué ci-contre.

Page 19: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer le suivi de l’ajout au panier avec Google Analytics

22. Dans les paramètres additionnels, activez les fonctionnalités avancées de commerce électronique l’utilisation de la couche de données.

Page 20: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer le suivi de l’ajout au panier avec Google Analytics

23. Créez un nouveau déclencheur de type événement personnalisé. Nom du déclencheur : addToCart. Nom de l’événement : addToCart

Page 21: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer le suivi de suppression de produits avec Google Analytics

Passons maintenant à la suppression de panier.

24. Créez une nouvelle balise Google Analytics « GA – Event – Suppression du panier » . Configurez-la comme indiqué ci-contre.

25. Créez un nouveau déclencheur removeFromCart.

Page 22: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerParamétrer le One Page Checkout avec Google Analytics

Dernier point, l’activation du One Page Checkout. C’est optionnel.

26. Créez une nouvelle balise Google Analytics « GA – Event – One Page Checkout » . Configurez comme indiqué.

27. Créez un nouveau déclencheur checkout_opc.

Page 23: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerPrévisualiser, débugger et publier son conteneur

Et voilà. Vous n’avez plus qu’à publier votre conteneur.

Prévisualisez avant afin de vérifier si :

• La balise de suivi de base se déclenche bien sur toutes les pages?

• La balise d’ajout au panier se déclenche lorsque l’on clic sur le bouton ?

• La balise suppression du panier se déclenche lorsque l’on supprime un produit ?

Tout est bon ? Publiez !

Page 24: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerConfigurer le e-commerce amélioré dans Google Analytics

28. Rendez-vous dans l’admin de Google Analytics, au niveau des paramètres de la vue, section paramètres du commerce électronique.

Page 25: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerConfigurer le e-commerce amélioré dans Google Analytics

29. Si ce n’est pas déjà fait, vous activez le suivi du e-commerce.

Passez ensuite à l’étape 2 et vous activez le commerce électronique amélioré.

Page 26: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Créer un compte Google Tag ManagerConfigurer le e-commerce amélioré dans Google Analytics

30. Vous devez ensuite paramétrer les différentes étapes de checkout.

Si vous utilisez le processus de commande standard en 5 étapes, configurez comme ci-contre.

Si vous êtes en one page checkout, pas besoin de configurer.

Page 27: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Aller plus loin

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

Page 28: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

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

Page 29: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

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).

Page 30: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

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

Page 31: Suivi du E-commerce amélioré pour Prestashop avec Google Tag Manager

Merci pour votre intérêt

Vous avez appris des choses? Partagez !