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