Papermashup

Subscribe


Tweets


"RT @bethgordon: .@Tesco Please rethink archaic 'Approved by Mums'. Pretty sure it's not just mothers who make childcare decisions. https://…"

@ashleyford 2 days ago

"Is there ever a time that @DFS doesn't have a sale on?"

@ashleyford 6 days ago

Designer and web developer, Co-founder and Technical Director at Harkable.com. Previously I worked at Spotify, MySpace and InMobi. Contact me - ashley[at]papermashup.com

JavaScript link tracking with Google Analytics

AshleyAshley

Google Analytics is great to tracking your site traffic. I started out using Statcounter.com to track my site visits, but over the years i’ve wanted more information so I switched over to using Google Analytics. Google provides an excellent dashboard to monitor and dig into your sites traffic and drill down the information to see exactly what content on your site is popular. For advertising campaigns at MySpace we use a JavaScript technique to track specific clicks on content on a page, with the ability to label specific content using the ‘name’ attribute. I’m providing the jQuery and Mootools code to implement this below. By using this technique when you view what content has been clicked in the analytics dashboard, and instead of seeing a bunch of long urls with various parameters in you can easily see a readable label as to what that link really is as shown below.

google-ana

jQuery Version

So below is a simple ‘click’ function that basically gets the value of the name attribute from any link that we set on our page and sends it to the analytics code at the bottom of our document.

Here’s an example of a link:


<a href=&quot;http://www.google.co.uk/search?hl=en&rlz=1G1GGLQ_ENGB314&q=papermashup.com&btnG=Search&meta=&aq=f&oq=name=&quot;papermashup search on Google;&gt;Search Google&lt;/>

$('document').ready(function () {
    $('a').click(function(){
        Pagetracker._trackPageview('/outgoing/' + $(this).attr('name'));
		});
	});

This is the analytics tracking code that will go just before the closing body tag on your page.


<script type="text/javascript"> 
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script> 
<script type="text/javascript"> 
try {
var pageTracker = _gat._getTracker("UA-6393355-53");
pageTracker._trackPageview('/outgoing');
} catch(err) {}</script> 
 

Mootools Version

This is exactly that same technique as above with the jQuery version but replicated with Mootools.



window.addEvent('load', function() {
		$$('a[name]').each(function(el) {
			el.addEvent('click',function() {
				var dd = '/outgoing/' + el.get('gaid');
				_gat._getTracker("UA-YOUR TRACKING ID")._trackPageview(dd);
			}.bind(this));
		});
});

So to sum up. To make your links easier to read in Google analytics add the name attribute to any link so when it’s clicked it will register with Google.

Designer and web developer, Co-founder and Technical Director at Harkable.com. Previously I worked at Spotify, MySpace and InMobi. Contact me - ashley[at]papermashup.com

Comments 6
  • quality
    Posted on

    quality quality

    Reply Author

    It іs perfect time to maκe some plans for the longer term
    and it’s time to be happy. I have learn this submit and if I could I want to recommend you some interesting issues or suggestions. Maybe you can write subsequent articles referring to this article. I desire to read more things about it!

    Here is my web site … quality


  • Alterity
    Posted on

    Alterity Alterity

    Reply Author

    Google Analytics is good but uses up a lot of bandwidth and is only updated once a day and not real time.


    • Ashley
      Posted on

      Ashley Ashley

      Reply Author

      @Alterity, actually Google Analytics is updated every hour or so, and a handy tip to see how much traffic you’ve had today is to click the date dropdown on the right of the main graph and select todays date, its always left out when you first visit analytics.


  • Eddie
    Posted on

    Eddie Eddie

    Reply Author

    Apolgies for being a tiny bit off topic, but you mention Statcounter in the post – Google Analytics is much more powerful than Statcounter but the one thing that I miss is the ability to view recent pageload activity. I can’t seem to an equivalent function in Analytics, do you know if it exists?


  • Seth
    Posted on

    Seth Seth

    Reply Author

    I have found the best combination of web analytic sites are google analytics with clicktale. After researching and trying many of the free versions i couldnt find better than clicktale because of its features and the live videos of visitors browsing sessions – a real gem!