Tunnel de conversion & Heatmap — Documentation
Tunnel de conversion en 9 étapes et heatmap clics/scroll pour PrestaShop 8 et 9.
Le module DataFirefly – Tunnel de conversion & Heatmap (dffunnelheatmap) réunit deux outils d’analyse comportementale pour PrestaShop 8 et 9 : un tunnel de conversion en 9 étapes qui montre précisément où vos visiteurs décrochent, et une heatmap qui révèle sur quoi ils cliquent et jusqu’où ils défilent. Toute la collecte est 100 % first-party, sans service tiers, sans CDN et sans cookie publicitaire.
Installation
- Téléchargez l’archive
dffunnelheatmap.zipdepuis votre compte client. - Dans le back-office, allez dans Modules > Module Manager, cliquez sur Téléverser un module et sélectionnez le ZIP.
- À l’installation, le module crée ses tables, enregistre ses hooks et ajoute un onglet Tunnel & Heatmap sous Statistiques.
Aucune dépendance externe : pas de Composer, pas de CDN. Le module est opérationnel immédiatement après l’installation, avec des réglages par défaut prudents (échantillonnage 100 %, rétention 90 jours, Do Not Track respecté).
Accéder au tableau de bord
Rendez-vous dans Statistiques > Tunnel & Heatmap (ou cliquez sur Configurer depuis la liste des modules). L’interface propose quatre vues : Tableau de bord, Tunnel, Heatmap et Réglages.
Le tableau de bord affiche quatre indicateurs clés : nombre de visites, nombre de commandes, taux de conversion global et repérage automatique de la plus grosse fuite du tunnel, accompagnés d’un aperçu visuel du tunnel.
Le tunnel de conversion
Le tunnel suit vos visiteurs étape par étape, de la première visite jusqu’à la commande validée. Pour chaque étape, vous voyez le nombre de sessions concernées et le pourcentage de chute par rapport à l’étape précédente. Les neuf étapes sont :
- Visite — toute page vue (détection serveur).
- Page produit — consultation d’une fiche produit (serveur).
- Ajout au panier — détecté côté client lors de l’action « ajouter au panier ».
- Page panier — affichage du panier (serveur).
- Tunnel de commande — entrée dans le checkout (serveur).
- Adresse — étape adresse du checkout (client).
- Livraison — étape transporteur (client).
- Paiement — étape paiement (client).
- Commande validée — enregistrée de façon fiable côté serveur via le hook de validation de commande.
Les sessions sont dédupliquées : une même session ne compte qu’une seule fois par étape, ce qui garantit des taux de passage justes. La plus grosse fuite est mise en évidence automatiquement pour vous indiquer où concentrer vos efforts d’optimisation.
La heatmap
La heatmap affiche un rendu réel de la page sélectionnée, sur lequel sont superposées les données de comportement collectées.
Carte des clics
Les clics sont représentés sous forme de carte de chaleur, du bleu (peu de clics) au rouge (forte concentration). Idéal pour vérifier que vos appels à l’action attirent réellement l’attention.
Profondeur de scroll
La profondeur de défilement est affichée par paliers (25, 50, 75 et 100 %), avec la part de visiteurs ayant atteint chaque niveau. Vous repérez ainsi le contenu vu par tous et celui qui passe sous la ligne de flottaison.
Top des éléments cliqués
Un panneau latéral classe les éléments les plus cliqués (par sélecteur CSS et libellé), pour identifier précisément ce qui capte l’intérêt.
La heatmap charge la page de la boutique dans une iframe en same-origin. Si votre serveur force l’en-tête X-Frame-Options: DENY, autorisez SAMEORIGIN pour le back-office afin que l’aperçu s’affiche.
Filtres
Toutes les vues partagent une barre de filtres : période (7, 30, 90 ou 365 jours, ou plage personnalisée), appareil (mobile, tablette, desktop) et boutique en contexte multiboutique.
Réglages
- Activation globale et activation séparée du tunnel et de la heatmap.
- Échantillonnage (1 à 100 %) appliqué à la heatmap uniquement, pour limiter le volume sur les sites à fort trafic. Le tunnel est toujours suivi à 100 %.
- Rétention en jours, avec purge automatique opportuniste et boutons de purge manuelle.
- Respect du Do Not Track (activé par défaut).
- Suivi des employés connectés au back-office (désactivé par défaut).
- Purge à la désinstallation pour supprimer les données collectées lors de la suppression du module.
Respect de la vie privée (RGPD)
Le module ne collecte aucune donnée personnelle : pas d’adresse IP stockée, pas d’e-mail. L’identifiant visiteur est anonyme et aléatoire (cookie technique dffh_vid). Le Do Not Track est respecté par défaut et la durée de rétention est entièrement configurable. L’endpoint de collecte est protégé par un token validé côté serveur.
Dépannage
Les sous-étapes du checkout (adresse, livraison, paiement) ne remontent pas. Elles reposent sur le checkout standard une-page de PrestaShop. Un thème fortement personnalisé peut nécessiter un léger ajustement des sélecteurs dans views/js/tracker.js.
Le comptage des conversions par appareil semble approximatif. L’appareil n’est pas connu côté serveur au moment de la validation de commande (étape 9) : le filtrage des conversions par appareil reste donc une estimation.
Désinstallation
La désinstallation supprime l’onglet et les hooks. Les données collectées sont conservées par défaut ; cochez l’option Purge à la désinstallation dans les réglages au préalable si vous souhaitez les supprimer définitivement.