Tracking Tab Views in Google Analytics

The Yahoo User Interface Library has a simple tab control that allows you to publish a single page with the content parsed into multiple tabs. The control works through the use of a bulleted list and specifically marked divs.

It's quite simple to implement (attach the Javascript), form the HTML properly and you're up and running. However, this type of control can be deceitful when it comes to viewing your analytics and who's viewing what.

Using Google Analytics, it's quite simple to add a page tracking mechanism to each tab. Within the anchor element on each list item, add an onclick event that adds a page view to a virtual page.

content-drilldownYou can customize the path within the quotes however you'd like.

To clean the page up, I would also push a pageview for the default tab when the page opens since everyone is going to view that tab upon opening the page. You can do this with a body onload event rather than the onclick event used in the anchor (a) tag.

Use the Content Drilldown menu in Google Analytics and you can now navigate to your page (or filter to “tabs”) and get a comprehensive look at the usage and views of your tabular content.


  1. 1
  2. 2

What do you think?

This site uses Akismet to reduce spam. Learn how your comment data is processed.