Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

Is there anyway I can use Google Analytics to track click conversions on a link?

For example, if I have a link to www.a.com , is it possible for google to track the number of times that particular link was shown on my page and then track how many times it was really clicked? The problem is that I do not show the link to www.a.com every time the page loads. I am using a random function (server side) to generate a different link everytime. I would like Google Analytics to provide me with the click conversion for each of the links I choose to show the user.

Thanks,

Joel

share|improve this question

1 Answer 1

up vote 4 down vote accepted

Yes, you can track just about anything using Google Analytics' Event Tracking - here's how you might do it for the two cases of (a) showing a link and (b) a user clicking the link:

(a) Track showing the link

<script type="text/javascript">
    _gaq.push(['_trackEvent', 'Links', 'Shown', 'http://www.a.com/']);
</script>

(b) Track user clicking the link

<a href="http://www.a.com/" onclick="javascript:_gaq.push(['_trackEvent', 'Links', 'Clicked', 'http://www.a.com/']); return true;">...</a>

Of course, given that you probably don't want to hard-code for both of these Javascript events, you can use a handy Javascript function to do all the work for you when links have a specific class - I like to use jQuery, so here's a quick example:

<script type="text/javascript">
/*
  ... assuming jQuery has been loaded and you're using the
      standard Google Analytics Asynchronous tracking snippet

      URL: http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html
*/
$(document).ready(function() {
    if ( $('a.tracked').length ) {
        $('a.tracked').each(function() {
            _gaq.push(['_trackEvent', 'Links', 'Shown', $(this).attr('href')]);
            $(this).bind( 'click', function() {
                _gaq.push(['_trackEvent', 'Links', 'Clicked', $(this).attr('href')]);
                return true;
            });
        });
    }
});
</script>

... and then every link with class="tracked" should be tracked accordingly.


Update: New code, but sure - you could even specify which group a link belongs to and track the group instead:

<script type="text/javascript">
    $(document).ready(function() {
        if ( $('a.tracked').length ) {
            $('a.tracked').each(function() {
                var groupRegExp =/group([a-zA-Z])/i;
                var group = groupRegExp.exec( $(this).attr('class') );
                if (
                    ( !group ) ||
                    ( !group.length )
                ) {
                    var group = "groupUnknown";
                } else {
                    var group = group[0];
                }
                _gaq.push(['_trackEvent', 'Links', 'Shown', group]);
                $(this).bind( 'click', function() {
                    _gaq.push(['_trackEvent', 'Links', 'Clicked', group]);
                    return true;
                });
            });
        }
    });
</script>

... which should work for class="tracked groupA", class="groupA tracked", etc.


Update x2:

... and to account for the behavior which yc01 mentioned, a slight modification to the function bound to tracked anchor tags:

                $(this).bind( 'click', function() {
                    _gaq.push(['_trackEvent', 'Links', 'Clicked', group]);
                    setTimeout('document.location = "' + $(this).attr('href') + '"', 100)
                    return false;
                });
share|improve this answer
    
First of all, great answer! Could not ask for much more :) I just have one more question, does the value of the last parameter, where you inserted the URL of the link (e.g. $(this).value('href')) must be a URL or can it also be a String? Since I have 2 groups of links I would like to treat all links from Group A as one entity... therefore I would like to create something like _gap.push(...'Shown', 'Group A') and _gap.push(...'Shown', Group B'). Is that valid? –  Joel Jan 9 '11 at 12:59
1  
@Joel - I was using URL's for exact tracking, but the linked Event Tracking document details what Google expects to see (probably some limits on string length) - updated w/a code sample which uses the link's class to determine which group it belongs to :) –  danlefree Jan 9 '11 at 14:30
    
Thank you for very much, been a while since I've received such a good answer! –  Joel Jan 9 '11 at 14:51
    
This code will only work reliably for links that open in new windows. Otherwise, there will be a race condition, and it won't track fully. –  Yahel Feb 2 '11 at 4:41
    
@danlefree that's not the race condition I'm referring to. Yes, that one exists, but its mostly trivial. The more serious one is that browsers do not consistently fully execute onclick handlers if they take too long before the page unloads. That's why you see a lot of implementations with setTimeout code. –  Yahel Feb 2 '11 at 16:25

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.