Tracking banners and other outgoing links - Automatically
GA Hacks, GA specific August 15th, 2007
A word of caution - This is a tech tip and requires you to have a knowledge of html and javascript to implement and use it…
Your site may offer a visitor a link to click through to an external web site such a subsidiary, an affiliate, advertiser or an trade organisation. For Google Analytics, a visit leaving your web site requires an edit to the page in order to track it. This is achieved by modifying your outbound links to call urchinTracker and is extremely easy to do. However, what if your web site has hundreds of separate outgoing links that are constantly evolving and being appended to? Clearly manually modifying each link becomes laborious and inefficient. To overcome this you can apply the example JavaScript code below to your web site:
<script type="text/JavaScript">
// Only links written to the page (already in the DOM) will be tagged
// Script can be called multiple times
function addExtLinkerEvents() {
var as = document.getElementsByTagName("a");
var extTrack = ["mysite.com"];
// replace mysite.com with your web site domain
for(var i=0; i<as.length; i++) {
var tmp = as[i].getAttribute("onclick");
// Track links off site – i.e. no GATC
if (tmp != null && tmp.indexOf('urchinTracker') > -1) continue;
for (var j=0; j<extTrack.length; j++) {
if (as[i].href.indexOf(extTrack[j]) == -1) {
var splitResult = as[i].href.split("//");
as[i].setAttribute("onclick",((tmp != null) ? tmp : "") +
"urchinTracker('/ext/" + splitResult[1]+ "');");
// the above must be on one line - from as[i]... to ");
break;
}
}
}
}
addExtLinkerEvents()
</script>
The script works by looking for links within the browser’s Document Object Model (DOM) that do not match the domain value given in the variable array extTrack. If the link does not match extTrack then it is considered an external link and so is modified to include the urchinTracker call. By this method, all external links will show in the Google Analytics reports as:
/ext/the-url-that-is-clicked-on
Where the-url-that-is-on clicked on is minus ‘http://’. You can modify the JavaScript to adjust the path as required,
Tip: The position of this code within your page is important. The code must be placed after your call to the Google Analytics Tracking Code (GATC). Alternatively place the addExtLinkerEvents() call in an onLoad event handler and host the provided JavaScript in a separate file. As an example I show this below, assuming the javascript is hosted in a file called trackExternal.js, as follows:
<script src="http://www.google-analytics.com/urchin.js" type="text/JavaScript">
</script>
<script src="/trackExternal.js" type="text/JavaScript"></script>
<script type="text/JavaScript">
_uacct = "UA-XXXXX-Y";
urchinTracker();
</script>
<body onLoad=”addExtLinkerEvents()”>
...your remaining web page content...
</body>
A note on performance: Each time your page loads, this script will go through all links referenced on the page to see if it is external. Clearly the more links on your page, the harder the script must work. As long as the number of links on each page number in the hundreds and not thousands, performance should not be a problem.
Also note that for pages with a large number of links, it is possible that visitors will click on an external link before the script has modified it. The result is that click through will not be tracked by Google Analytics which is an accuracy consideration that effects all web analytics vendors.
Did you find this tip useful? I am considering writing more of these tech tips if you feel they are useful. Please provide your feedback with a comment.
Email This Post
Print This Post


August 15th, 2007 at 1:22 am
Brian,
I like your solution to link tracking. It is much easier than even using server side code to include link tracking.
I would love to see this code integrated into Google Analytics. It would be great to have an Outbound link tracking report in the interface.
August 15th, 2007 at 6:40 am
I made a script like this (http://andrescholten.nl/index.php/uitgaande-links-simpel-meten-met-google-analytics/) a while ago, but a big disadvantage are the extra pageviews it creates. The moment you start doing this, your total amount of pageviews isn’t reliable anymore.
August 15th, 2007 at 8:27 am
@Andre: I guess you could remove the pageviews you create by scripts like these on an extra profile? That way you could have the data and still have reliable pageviews as well.
@Brian: I’ve been working on a WordPress plugin to do this and a bit more, email about that is in your inbox
August 15th, 2007 at 9:25 am
Feedback: yes, please. More of these. This kind of thing is extremely welcome.
I must admit, I am concerned about performance. Our pages are already loaded with code to help US which does nothing for the user experience, apart from slow them down! Biggest issues there tend to be with calling stuff from other servers, though, not this kind of thing.
August 16th, 2007 at 9:40 pm
Andre: You are correct in that the purpose of using urchinTracker in this way is to create additional pageviews (virtual pages), but this is entirely valid. For example, if you add content to your web pages that encourages people to click away, then you should measure it. Although not ideal, treating this as a pageview gives you great insight into the value of those links - that is, they could be one of your goals with an associated goal value. Many sites make a living out of doing just that - acquiring visitors and them encouraging then to click away. See my Recommended Reading section for the affiliate links to Amazon for example! In fact this ‘virtual pageview’ technique is the same technique used by all page tag vendors for tracking a pdf download for example. Joost’s idea of keeping them in a separate profile is also a great idea.
Tim: Speaking of performance, one advantage of using such a widely adopted tool as GA, is that it is the same js file used for all implementations. So, if you visit say Blockbuster video one day, then Nestle a week later, the urchin.js file (essentially the page tag/beacon that collects data) will be cached by your browser. Relieving the visitor of the need to download again.
Joost: nothing in my mailbox…
August 30th, 2007 at 11:32 pm
Yes, these tips are valuable. Please continue to write more like this!
Thanks,
BJ
September 4th, 2007 at 1:15 am
I really like this js code Brian. Is it possible to provide one snippet of code that will not only automatically track outbound links but also file downloads (pdf, doc, etc)?
September 5th, 2007 at 2:43 pm
Brendan: yes, this site does just that. Thake a look at the code in:
http://www.advanced-web-metrics.com/addLinkerEvents.js
I will post an article describing this soon.
September 6th, 2007 at 1:31 am
Brian,
There are a bug in your example code.
It IE again… the getAttribute(”onclick”) does not work when there are data in the onclick attribute, IE returns a object instead of a string.
you can read more about it here:
http://tobielangel.com/2007/1/11/attribute-nightmare-in-ie
September 6th, 2007 at 11:26 pm
Hey,
I have made an new version of your script to some of my clients, one of biggest requirement for the script was that i could be install on any web site by a no tec person, and not conflict with existing JS code. I also add some extra features to track download of documents, mailto and onclick events.
script: http://trend.iih.dk/js/analyticsTools.js
Example’s usage:
Example 1, set the domain to my page and add tracking on only normal and mailto links
analyticsTools.domains = ['mysite.com','www.mysite.com'];
analyticsTools.trackEvents = ['link','mailto'];
analyticsTools.addLinkerEvents();
Example 2, set the domain to my page and add tracking on download of doc’s
analyticsTools.domains = ['mysite.com','www.mysite.com'];
analyticsTools.trackEvents = ['download'];
analyticsTools.downloadDocs = ['.doc','.xls','.pdf'];
analyticsTools.addLinkerEvents();
Comments, bugfix’s and improvements are more then welcome
September 12th, 2007 at 12:25 pm
Anders: just read your posts - nice work with the scripts and in fact overlaps with my last post http://www.advanced-web-metrics.com/blog/2007/09/10/tracking-links-to-direct-downloads-automatically/
Are you using your script successfully on your site?
October 18th, 2007 at 6:45 am
Hi Brian,
Great script. My testing is showing that downloads are appearing in google analytics with malformed tagging.
for some reason all my downloads appear as /downloads.au/
in the content report. The site is .com.au? perhaps my implementation was wrong, maybe you could include some brief instructions in the header of you .js file Anders.
Any plans to add tagging of mailto: links to this script?
I also tested iih’s script ( mainly because it said it would track mailto: links ) Unfortunately I was unable to get this to work. Perhaps
October 18th, 2007 at 11:08 pm
Robert: something odd there - can you post the url of a sample page on your site that has the script.
October 19th, 2007 at 12:18 am
This script is setup on http://www.novotelningaloo.com.au
by the way my last post was somehow muddled up. Your instructions on how to install the script are fine Brian.
Anders script needs some sort of documentation.
I did some more testing, I changed the /downloads path in the default script to be /downloads/
This has made it start counting the pageviews with the /ext/
which is even stranger!
October 19th, 2007 at 12:20 am
Any ideas on if it is possible to track flash events through this script? I mean in theory is it possible?
We often have book online buttons done in flash which I would like to track to.
October 24th, 2007 at 3:40 pm
Hi Robert - unfortunately you cannot use the browser DOM (Document Object Model) to track Flash events. Flash is a walled garden in that respect. In order to track these, the javascript has to be added within the fla file.
The good news however, is that I have modified my script to also track mailto: links - see the latest version on http://www.advanced-web-metrics.com/blog/ga-scripts/
enjoy
July 19th, 2008 at 1:20 am
What if your link is ON the domain but it’s actually a redirect to an affiliate page. Because the redirect is php, I can’t put google’s code on there and still have the redirect work. Is there a way of tracking these links?