16 Feb 2011

Tracking clicks on blog widgets

I play around with the layout and widgets used in my blog all the time.  Every time I make a change I believe that the change makes the blog better, for example by providing more useful links on the sidebar.  All this while I had to blindly hope that the sidebar links are useful.  But today I made a change so I can measure the usefulness of the sidebar widgets.

Side note: Google Analytics has a feature called event tracking that can be used to track events that happen within a single page.  Let's say you have built an awesome game hosted on a single URL on your web site.  Your game might be so addictive that many users open it first thing in the morning and keep playing all day.  If you measure only page views you won't know that people are playing the game all day because technically the game is loaded only once (though it's kept open for much longer).  To get more accurate usage data you can add some event tracking code and record an event every time the game begins.

I decided to add event tracking to several widgets in my blog so I can know which widgets are being clicked by the visitors and which are not.  But adding event tracking to Blogger's built-in widgets was not very obvious.  I navigated to Design > Edit HTML tab of my blog's dashboard and selected Expand Widget Templates check box to see the code for widgets.

I had to locate each widget's code within the template.  Searching for the widget title text was sufficient.  Code for the label cloud widget, for example, starts like this:
<b:widget id='Label1' locked='false' title='labels' type='Label'>
<b:includable id='main'>
  <b:if cond='data:title'>
The widget code had different sections of HTML pertaining to different configurations provided by the widget (show list vs. cloud, show post count, etc).  I added onclick event handlers to the links so every time a link is clicked an event will be recorded.  Here's one such modification I made:
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' onclick='_gaq.push(["_trackEvent", "label-cloud", "follow-link"])'><data:label.name/></a>

Now that event tracking is in place, decision making in the future will be easy.  Hopefully :)


  1. ThanQ so much..i wanted this to track my Affiliate Banners Clicks (CTR)..thanx again

  2. Hii..where i must have to paste this code? I have placed a image banner ad now i wanted to track whether anyone clicked it or not. Please help.. My blog is http://sundayfreak.blogspot.in/

    1. Hi. If it's an AdSense ad widget, you can use AdSense custom channels. If it's a regular link, consider using Analytics custom campaigns.

  3. Very helpful article. Your topics in this blog vary a lot - from honda bikes (which I love) to IT technologies. Maybe I missed it, but have you ever made virtual data room reviews in your blog? If yes, could you please provide me with the link? Thanks in advance.

    1. Thank you, Rick. No, I have not used virtual data room reviews.