Si vous avez un site e-commerce, vous vous êtes déjà probablement posé la question de savoir comment suivre l’évolution du nombre de vos visiteurs. Pour cela, de nombreuses solutions de tracking existent, la plus répandue étant une fois de plus celle proposée par Google : Google Analytics !
Sur PrestaShop, il y a 2 manière d’intégrer le tag de suivi Analytics à votre site :
- en installant un addon PrestaShop ;
- en intervenant manuellement directement dans le code de votre boutique.
Installer un module Google Analytics sur PrestaShop
Il existe de nombreux modules PrestaShop permettant d’intégrer de façon “automatique” le code de suivi Google Analytics à votre site marchand. Une fois installé, il vous suffit alors de renseigner votre ID de suivi dans la configuration du module directement depuis votre back-office PrestaShop.
C’est simple, efficace, MAIS … il est possible que cette intégration automatique ne soit pas parfaitement compatible avec d’une part le thème de votre site, et d’autre part avec certains paramétrages que vous pourriez avoir mis en place via votre back-office.
Ne vous inquiétez pas, on va traiter cela un peu plus bas, mais si vous êtes concerné par cette remarque, sachez que vous allez peut-être devoir songer à une intégration manuelle de votre tag de suivi !
Installer manuellement le script de Google Analytics
La 2è méthode, plus précise et beaucoup fiable en terme d’optimisation est celle que je préconise.
Modification du fichier header.tpl du thème.
Vérifier la bonne installation du tag
télécharger et utiliser Google Tag Manager (GTM) via Chrome ou Firefox.
Les problèmes de suivi
Il est fréquent de remarquer de grandes incohérences entre les stats de clic sur GSC et le trafic annoncé par GA. Bien qu’il puisse y avoir de nombreuses causes, la plus fréquente est le plus souvent la mauvaise installation ou prise en compte du tag sur votre site. Si vous avez intégré le tag via un module, vous pouvez soit contacter le développeur qui vous fera peut-être payer une modification du code de son module. Mais vous pouvez aussi désactiver le module et instégrer manuellement le script de GA.
Si par exemple GTM vous indique le message d’erreur suivant : “code out balise head”, cela signifie que le code n’est aps présent là ou GG préconise de l’installer, à savoir entreet. Si vous avez activé le déplacement du JS à la fin du code source dnas le menu performances du back-office, ce message d’erreur est tout à fait normal. Car bien que le script GA soit présent initialement entre les, l’activation de l’op^tion de déplacement aura pour effet de déplacer dynamiquement votre script en bas de votre site, ceci afin d’optimiser le temps de chargement de vos pages, mais au détriment des préconisations et d’une bonne remontée de vos stats dans GA.
Pour pallier à cela en conservant une optimisation au niveau du déplacement du JS, il faudrait donc que tous vos scripts soient déplacés en bas de votre site, sauf celui de GA. Cette option n’est pas disponible directement depuis votre back-office. On va donc voir comment faire en modifiant légèrement le code de votre site.
Override de la class Media
Le déplacement de vos JS est en parti dû à la classe Media située dans classes/Media.php
Il va donc falloir modifier cette classe pour permettre certaines exclusions quant au déplacement de certains JS, letag GA dans notre cas.
On pourrait très bien modifier directement ce fichier en l’ouvrant, mais cela ne serait pas très propre et vous risqueriez de perdre cette modification lors d’une éventuelle mise à jour de votre boutique. Bref, sans rentrer plus dans le détail, faite moi confiance et ne modifiez pas directement le fichier Media.php
On va l’overrider, ce qui correspond à rajouter une couche de code destinée à remplacer le code natif de la classe.
allez dans le répertoire Override puis dans Classes.
Là, créez un fichier vierge que vous nommerez Media.php.
C’est das ce fichier que nous allons surcharger le code initial de la classe.
En bref, votre fichier /override/classes/Product.php doit contenir ceci :
class Media extends MediaCore {
public static function deferScript($matches)
// ici vos modifications
}
}
?>
Ainsi, dès que PrestaShop fera appel à la fonction Media::deferScript(), il prendra en compte votre surcharge.
Cette surcharge va permettre de gérer des exceptions et de ne pas déplacer certains scripts JS en bas de page. Pour faire simple, au niveau de la ligne 24, on indique à PrestaShop de ne pas déplacer le code si la balise script contient l’attribut data-keepinline=”true”.
Ne pas déplacer le tag GA en bas de page
Une fois la classe Media de votre site surchargée, il ne vous reste plus qu’à éditer votre script GA en ajoutant l’attribut mettant en exception le déplacement de votre tage en bas de page, et cela tout en conservant une bonne optimisation de votre code.