Entourage.js, un script pour traquer les téléchargements avec Google Analytics
Aussi incroyable que cela puisse paraitre, Google Analytics ne propose pas par défaut le tracking des téléchargements. Pire pour créer ce suivi, il faut attacher un évènement onClick à chaque lien.
<a href="http://www.example.com/files/map.pdf" onClick="javascript: _gaq.push(['_trackPageview', '/downloads/map']);">
Ce n’est pas grave car il y a des solutions, même si vous avez déjà des milliers de liens sur vos sites.
Entourage.js est un script très léger (339 octets zippé dans la version compilé) qui permet d’ajouter un suivi des liens de téléchargement dans Google Analytics. Il permet de récupérer les types et noms des fichiers téléchargés sous la forme /download/fileName.extension
.
Adossé à aucun script ou framework existant, Entourage ne nécessite pas de changement dans le markup des pages : ni JS inliné, ni classe, … Surtout, il n’est pas bloquant.
Je vous passe les détails techniques; il suffit d’inclure la déclaration du script dans le header de vos pages :
<script src="javascripts/entourage.js"></script>
C’est tout; désormais les téléchargements apparaitront dans votre compte Google Analytics.
/download/entourage.zip 1,504
Pour les plus intéressés, le code complet est le suivant :
(function() { var entourage = new (function() { this.VERSION = "1.1.0"; //Get true FileName from link pathname var getFileName = function(pathname) { //No updates... return pathname; }; var autograph = function() { var whitelist, pathname, match, fileName, associate; whitelist = /.pdf$|.zip$|.od*|.doc*|.xls*|.ppt*|.exe$|.dmg$|.mov$|.avi$|.mp3$/i; //The link object is now available in "this" pathname = this.pathname; //Compare the fileType to the whitelist match = pathname.match(whitelist); if (typeof match !== "undefined" && match !== null) { //Get the file name fileName = getFileName(pathname); //Add file to the Google Analytics Queue associate="/download/" + fileName; _gaq.push(['_trackPageview', associate]); } }; this.initialize = function() { var links = document.links; for (var i=0, l=links.length; i<l; i++) { //Call Entourage whenever the link is clicked links[i].onclick = autograph; } }; })(); //Entourage.js //Add entourage to the global namespace window.entourage = entourage; //Execute onload - ensuring links are present in the DOM window.onload = entourage.initialize; })();
J’aime cette simplicité.
Téléchargez Entourage.js