Tracking all outgoing links with Google Analytics

Morten Bock — Sun, 15 Apr 2007 23:00:10 +0100

I wanted to try and find a way to track all of the outgoing links on my blog, without haven to modify the html of the link. What I found was that using javascript listeners would probably be the best solution. Actually this technique can be used for a lot of stuff, but this is what I did:

<script type="text/javascript">
// Cross-browser implementation of element.addEventListener()
function addListener(element, type, expression, bubbling) {
    bubbling = bubbling || false;

    if (window.addEventListener) { // Standard
        element.addEventListener(type, expression, bubbling);
        return true;
    } else if (window.attachEvent) { // IE
        element.attachEvent('on' + type, expression);
        return true;
    } else return false;
}

//This is what i want to do whenever someone clicks on the page
function itHappened(evt) {

    //Get the clicket element
    var tg = (window.event) ? evt.srcElement : evt.target;
    //If it is an A element
    if (tg.nodeName == 'A') {
        //And it is not an internal link
        if (tg.href.indexOf(location.host) == -1) {
            //Replace all odd characters, so that it works with Analytics Niavgation analysis
            var url = tg.href.replace(/[^a-z|A-Z]/g, "_");

            var txt = tg.innerHTML.replace(/[^a-z|A-Z]/g, "_");
            var str = '/outgoinglink/-' + txt + '-' + url;
            try {
                //Track it
                urchinTracker(str);
            }
            catch (err) {
                //alert('error: ' + err);
            }
        }
    }
}
//Add the click listener to the document
addListener(document, 'click', itHappened);</script>

I hope you can use it. Any comments or advice is very welcome :-)