This evening I’ve set up my side bar “Find me on” links to track outbound clicks using a javascript onclick event. I’ve set this up mainly out of a curiousity to find out how much of my traffic exits via my Wordpress sidebar, and of course an interest in how this type of outbound link tracking works!
My post builds on a great article (and plugin) from Joost De Valk. His article, Checking your outbound click stats is a fantastic run through of how to use the Google Analytics “content drilldown” report to work out where you’re sending traffic (providing you’re tracking the clicks). If you’ve correctly installed his plugin, your comments, downloads, comment author link, article links and blogroll link clicks are all tracked automatically. Those outbound clicks should look like this:
But what if, like me, you’ve created a bespoke sidebar, that isn’t quite dynamic enough to talk to a plugin like this? Basically, I’ve hard coded my sidebar links and I’d like to be able to track what exit clicks they’re generating.
Tracking your (hardcoded) sidebar link outbound clicks with a javascript onclick event
I’m going to use my “Find me on” links on the right hand side of this blog as the example. In short, I have worked through the HTML in this code and replaced the ordinary link anchor (<a href=) with the onclick event that will trigger the Google Analytics outbound link click tracking:
The first snippet of code is my Linkedin profile link. It’s an ordinary bit of code for an image that carries an outbound link in the HTML anchor.
Below is our next snippet. By using firebug in inspect mode, I grabbed the default onclick code from an outbound link from one of my recent articles and carefully replaced the href= url to the one I want to track. You will notice (If you look at an onclick in another article post on this blog) that I have changed the code “/outbound/article/” to “/outbound/sidebar”. This change will separate out click data coming from my sidebar – and will appear neatly in the content drilldown report above.
Finally, I need to update the first code snippet with this new onlick event. All that needs to be done here is replace the old HTML anchor link with this entire line of code:
This image link will now track just like the rest of the outbound links on my site. Take a look by inspecting the code in my sidebar with firebug. Enjoy! 
Blog RSS Feed
Blog Posts by Email
{ 32 comments… read them below or add one }
Good stuff! Guess you don’t mind if I reference this from my plugin page?
Hi Joost, thanks for dropping by! I’d be honoured if you referenced this post from your plugin page!
cool stuffs and I like it. It will work for me …thanks.
Hi there – really like your blog, I’ll add your feed right now. Great design, too.
Would this effect the SEO credit you get for outbound links?
Hi Jaan,
That’s the great thing about onclick – as most crawlers don’t execute javascript, all they see is the <a href= part of the link. So, to answer your question, yes. I wrote a little more about this here – which includes an experiment I’m running to show that Google does not index this kind of onclick event. As of today, Google has still not indexed the tracking url encapsulated in in the “seogadget homepage” link.
Hope all this is useful – if you like the other post, give it a Sphinn!
How to track links such as domain.com/wp-contents/upload in google analytics for WP site.
I had posted an image link from my site reasonpad.com(link: http://reasonpad.com/wp-content/uploads/2008/10/septembermadnessb.jpg) to reddit and its in the front page. But Google Analytics is not tracking the visits to the link. I have downloaded the Google Analytics to my WP dashboard but did not help.
Pls help.
P{aul
Great post. I was previously running urchin tracker and with the new Google Analytics code, it seemed to make sense to switch to Yoast.
With your custom coding above, how long does it take to start reporting?
Thanks!
@Darren – the reporting starts as soon as the code is in the page. Hope that helps!
Hi,
I found this very useful thankyou but on some pages of my site I am trying to track clicks on affiliate links to products that are coded as iframes and scripts rather than as hrefs. How would I integrate this theory in those circumstances? I am in now way a techie so please made it idiot proof!
Thanks
Chloe
It would be better if you used an Event to track this instead of a Pageview, it goes like this for an event
This way you can better track where you’re users went and from where they clicked the external link. Plus it won’t mess you’re usual pageviews.
Oops my code was stripped (damn you Wordpress), hopefully it will get through now.
<a href=’http://externalsite.com.br’ onClick=’pageTracker._trackEvent(‘outbound’,this.href,location.href)’ ><img src=’myimage.jpg’/></a>
Works fine! Thanks!
Very slick and easy. Thank you.
This is awesome. I have been fiddling with this for an hour and cannot get the code to work. I had forgotten that Yoast’s plugin tracked these events. Then I realized that I was hardcoding in the sidebar and things wouldn’t track properly anyways!
Super duper!
Hi Guys, anybody know if there is a way to stop outbound links diluting your overall number of uniques/pv’s etc. I’m experimenting with adding this in…any help appreciated. Tom
Hey Tom, your answer has been given by Eduardo Cereto: use Events instead of Pageviews (code to be found in the comments).
Thank you all for this very helpful post and comments.
Thanks, will certainly try this out and let you know how it goes. Tom
Thanks Richardbaxterseo.
In Google Help very much information about traking.
In this articles is simple and clear for understanding.
Hello,
Any idea on how to track clicks on swf flash files? Maybe a plugin for WP would help too.
Tks
@Leandro: This article may help you with tracking Flash in GA: http://www.webfuel.ca/qct
@Les from what I understood I’d use that to build the flash file. In my case it’s given, I just want to know how many people click on it (an ad on my blog)
@Leandro. Can you please post a link to what you want to track?
@Les
it’s the banner on the bottom of my site (link to my site on my nick here)
I’m negotiating an important one to the header, an tracking it would be very nice.
@Les
I don’t think the absolute path to the file is important, is it?
Simple enough: http://www.google.com/support/analytics/bin/answer.py?hl=en&answer=55526
Read the entire article.
For a Flash Banner Ad — See below:
The equivalent code for a Flash banner is provided below:
on(release) {
getURL(“javascript: pageTracker._trackPageview
(‘/bannerads/advertisername/bannername’);”);
getURL(“http://http://www.feiradelogistica.com/”);
}
@Les
Thanks a million! I’ll test it in a test site and as soon as I check it works OK I’ll put on the main site as well.
BTW, I suppose you’re also based in Canada (although I run a brazilian site)
You are very welcome. The code should work just fine.
Yes, I am in Ottawa.
You?
I’m in Montreal.
My hometown!
@Leandro @Les
Thanks guys for clarifying that (very useful) addition to this post. Your comments are much appreciated!
Thanks, Richard
Cool, thanks so much for the detailed instructions