How to use a variable in Google Analytics' Custom Variable

Question

I'm trying to track a particular section of links on my page. I want to know what is clicked, so I'm trying to set up a click handler with jQuery to register a custom variable with Google Analytics, but it's not working. Here's my code:

  <!--Google Analytics-->
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-18698622-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

$(function(){
$('a.link-item.bullet').click(function(){
_gaq.push(['_setCustomVar', 1, 'National Link', $(this).text(), 2]);
});
});
</script>

It's been about 3 or 4 days, and I haven't seen any custom variables register yet. Maybe I can't have include a variable ($(this).text()) in the custom variable? Anyone tried this before?

Answer 1

It looks like you just need to change the order of a couple of lines--in particular, your Custom Variable must be set before _trackPageview is called.

The trackPageview() call aggregates the analytics data from various sources (cookies, location bar, request headers, DOM ), concatenates it and sends it to the Google Analytics servers in the Request Header (for the _utm.gif). So if your Custom Variable is not set when this function is called, it is not logged by GA.

In this case, the value of your Custom Variable is triggered by an event (e.g. user clicking a button on the page), so just call _setCustomVar() when the event fires. E.g.,

<input type="button" name="National Link", value=[dynamically set], onclick="my_function()", 2>

*my_function() of course, calls _setcustomVar*

Answer 2

For my purposes, it was better for me to use Event Tracking and not a custom variable. For tracking the clicks to a certain set of links, I could just use the following code:

$(function(){
$('a.link-item.bullet').click(function(){
_gaq.push(['_trackEvent', 'National Link Event', $(this).text()]);
});
});

I'm not sure why this worked and not the custom variable function; must be that _setCustomVar relies on the _trackPageview function and _trackEvent does not. This code appears after the _trackPageview function, and it works great: on a click, the event appears as a "National Link Event" with an action named after the link text.

I can still see why it would be useful to use variables in the _setCustomVar function, and I still haven't figured that one out, but I haven't any personal use for it yet.

Answer 3

I agree that for your situation, event tracking is indeed a better fit. (A user may visit a page without clicking a link, or maybe click more than once?) Custom variables are handy if you know something about a user ahead of time, but as doug points out, you have to set them before calling _trackPageview.

<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXXXXX-1']);
  _gaq.push(['_setCustomVar', 1, 'name-goes-here', 'value-goes-here']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>

On a side note, there is a known bug using custom variables when tracking characters that need to be URL encoded (http://www.google.com/support/forum/p/Google%20Analytics/thread?tid=2cdb3ec0be32e078&hl=en).

In your case, 'National Event' would be saved as 'National%20Event' using custom variables, which is not ideal either.

If done properly, you can actually use both custom variables and event tracking within the same application, and build a custom report that references both data sources. (http://code.google.com/apis/analytics/docs/gdata/gdataReferenceValidCombos.html).