How to Track Downloads & Outbound Links in Universal Analytics

How to Track Downloads & Outbound Links in Universal Analytics

Posted by on Wed, Sep 4, 2013
Filed Under | Google Analytics


By default Google Analytics does not track file downloads, email, telephone or other outbound link clicks automatically. We developed dynamic link tracking code a couple years ago to address this and due to the popularity, we revisit it from time to time as the Google Analytics platform evolves.

The latest evolution is Universal Analytics and we have updated the code we provided in our previous ‘How to Track Downloads & Outbound Links in Google Analytics’ blog post to use the new Universal Analytics syntax.  The recent version of the tracking code includes an additional feature that leverages the NEW hit callback functionality.

If you are not yet familiar with Google’s Universal Analytics, we encourage you to read a brief case study, ‘Yellow Pages Group New Zealand Upgrades to Universal Analytics‘, about one of our Google Analytics Premium clients who is utilizing Universal Analytics. The post outlines the benefits of the new platform, as well as, how we leverage and extended Universal Analytics to meet their unique business needs.

Dynamically Track Downloads & Other External Links

The code below will dynamically detect clicks on file downloads and external links. As before, this code requires the jQuery JavaScript library to be set before the code.

The code can be easily modified to suit your needs. We recommend placing the code in its own .js file.  This script automates the following:

  • Tracks file downloads as events for the following extensions: .zip, .exe, dmg, .pdf, .doc, .docx, .xls, .xlsx, .ppt, .pptx, .mp3, .txt, .rar, .wma, .mov, .avi, .wmv, .flv, .wav (again feel free to modify the list)
  • Tracks outbound clicks as events if the href value contains http:// or https:// and the domain value doesn’t match the current domain
  • Tracks mailto email clicks
  • Tracks Tel telephone clicks

In addition, the code takes advantage of a new Google Universal Analytics callback feature to determine when the hit request finishes sending data. This is especially useful in cases where the link does not open a new window, since the hit request needs time to finish before taking the user to their destination.  This eliminates the requirement of putting a timeout in place to delay the click longer than it needs to be delayed (or quicker than it should on high latency connections).

<script type='text/javascript'>
if (typeof jQuery != 'undefined') {
	var filetypes = /\.(zip|exe|dmg|pdf|doc.*|xls.*|ppt.*|mp3|txt|rar|wma|mov|avi|wmv|flv|wav)$/i;
	var baseHref = '';
	if (jQuery('base').attr('href') != undefined) baseHref = jQuery('base').attr('href');
	var hrefRedirect = '';

	jQuery('body').on('click', 'a', function(event) {
		var el = jQuery(this);
		var track = true;
		var href = (typeof(el.attr('href')) != 'undefined' ) ? el.attr('href') : '';
		var isThisDomain = href.match(document.domain.split('.').reverse()[1] + '.' + document.domain.split('.').reverse()[0]);
		if (!href.match(/^javascript:/i)) {
			var elEv = []; elEv.value=0, elEv.non_i=false;
			if (href.match(/^mailto\:/i)) {
				elEv.category = 'email';
				elEv.action = 'click';
				elEv.label = href.replace(/^mailto\:/i, '');
				elEv.loc = href;
			}
			else if (href.match(filetypes)) {
				var extension = (/[.]/.exec(href)) ? /[^.]+$/.exec(href) : undefined;
				elEv.category = 'download';
				elEv.action = 'click-' + extension[0];
				elEv.label = href.replace(/ /g,'-');
				elEv.loc = baseHref + href;
			}
			else if (href.match(/^https?\:/i) && !isThisDomain) {
				elEv.category = 'external';
				elEv.action = 'click';
				elEv.label = href.replace(/^https?\:\/\//i, '');
				elEv.non_i = true;
				elEv.loc = href;
			}
			else if (href.match(/^tel\:/i)) {
				elEv.category = 'telephone';
				elEv.action = 'click';
				elEv.label = href.replace(/^tel\:/i, '');
				elEv.loc = href;
			}
			else track = false;

			if (track) {
				var ret = true;

				if((elEv.category == 'external' || elEv.category == 'download') && (el.attr('target') == undefined || el.attr('target').toLowerCase() != '_blank') ) {
					hrefRedirect = elEv.loc;

					ga('send','event', elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
						'nonInteraction': elEv.non_i ,
						'hitCallback':gaHitCallbackHandler
					});

					ret = false;
				}
				else {
					ga('send','event', elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
						'nonInteraction': elEv.non_i
					});
				}

				return ret;
			}
		}
	});

	gaHitCallbackHandler = function() {
		window.location.href = hrefRedirect;
	}
}
</script>

The script sets download, email and tel link clicks as interaction events while the external site clicks are non-interaction, which can be adjusted as needed.

Detailed Download & External Link Reports

Once you have implemented the new tracking code you will be presented with well organized event data around file downloads, external link, email link, and telephone link clicks. These reports are especially useful to determine the effectiveness of your file downloads and various links.

events_report_new

If you would like to see the most popular downloads, you can do so by drilling down into the event category and selecting event label as the primary dimension. Here is a download report example:
events_downloads_new

Let us know if you have any questions about this new evolution of the outbound link and download file tracking code, or if you want to know more about Google Universal Analytics in general.

Enjoy this post?

Join the discussion below, subscribe to our RSS feed or share it on the web.

This post was written by:

has written 4 posts on the Web Analytics Blog.

Ryan is a Google Analytics Consultant at Blast Analytics & Marketing. With a variety of skills under his belt he spends his days assisting clients with all of their Google Analytics needs. Fueled by music, he relishes a good challenge and is driven to learn.

Add Ryan to your circles on Google+


Tags: , , , , , , ,
  • Bronwyn V

    Not sure why, however I can’t for the life of me get this script work,

    I wasn’t sure if it was due to the version of jquery i was using, so i tried both 2.0.3 and 1.10.2 just incase

    I added jquery via google libraries and added the above code after it in its own js file

    Tested it with a download link to a file and an external link and nada, zip, zilch.

    adding an id to a link and using the following jquery at the bottom of the page instead, sends an event without issue

    jQuery(‘#yup’).on(‘click’, function() {
    ga(‘send’, ‘event’, ‘links’, ‘linkclick’, ‘exitlinks’);
    });

    Any hints on what I may be doing wrong would be hugely appreciated

    Thanks :-)

  • drgs100

    Hi Ryan, many thanks for this been a great help. Unfortunately I have not got this version working so instead I used a recommendation from the comments of the previous post to replaced the _gaq.push line with:

    ga(‘send’, ‘event’, elEv.category.toLowerCase(), elEv.action.toLowerCase(), elEv.label.toLowerCase(), elEv.value, elEv.non_i);

  • disqus_wKSpp72Chl

    Does this script work – seems to be some issues by the comments below? Please advise.

  • http://www.blastam.com/ Olaf Calderon

    Hello Hannah,

    If you’re using WordPress, I would suggest using a plugin for GA. http://yoast.com/wordpress/google-analytics/, it’s a really good one and it does download tracking automatically. Otherwise you’ll need to modify your template via php and that can get a bit tricky -

  • http://www.blastam.com/ Olaf Calderon

    Hello Bronwyn,

    I’m sorry you’re having problems with the script. It’s really hard for me to troubleshoot your problem since I don’t see your code. I know this response is a little dated but in case you have not yet resolved this, please send me a link and I’d be more than happy to help -

    thanks!

  • loldroid

    doesn’t work me either. I tested it with manually adding
    ‘onclick=”ga(‘send’,'event’,'category’,'click’,'label’);”‘ to a link and it worked.

  • Johan

    I’m using jQuery 1.9.1 and isn’t working for me either. Should this script be loaded after the GA tracking script?

  • Harold R

    I am not able to get this script working also. Have converted to Universal Analytics and added this link to JQuery.
    Is this correct?

  • Janek Kowalski

    Hej, It looks great! But it does not work in Chrome 32. Look like it blocks clicks – prevent default action. FF and Opera OK.

  • Ryan Chase

    Hi Janek,

    I tested this in Chrome 32 and it was working. What version of jQuery are you using?

  • Ryan Chase

    Hi Johan,

    I tested this using jQuery 1.9.1 and it is working. The script should appear after your GA tracking code and your reference to jQuery,

  • Janek Kowalski

    jquery-1.10.2.js , I have had to remove ret = false

    from :

    if((elEv.category == ‘external’ || elEv.category == ‘download’) && (el.attr(‘target’) == undefined || el.attr(‘target’).toLowerCase() != ‘_blank’) ) {
    hrefRedirect = elEv.loc;

    because all links stopped working.

  • Joel Lowther

    Just a quick note. You will want to apply this code just above the /body tag. Putting it below the universal code and right above the /head tag will not allow the code to function.

    Another quick side note for those who don’t use Google Analytics very often, use the Real-Time > Events option to see if the code is working.

  • sonofray

    I’m getting an error in Dreamweaver “There is a syntax error on line 3.” (below). Should I be concerned? I don’t have it working yet.

    Line 3:
    var filetypes = /.(zip|exe|dmg|pdf|doc.*|xls.*|ppt.*|mp3|txt|rar|wma|mov|avi|wmv|flv|wav)$/i;

  • sonofray

    Nevermind. I forgot to remove the script tags at the beginning and end when I made it a remote script. Heh.

  • Aaron Weiner

    Ryan, thank you very much for this blog post. I finally got the code to work by placing it right after the opening body tag. Thanks!

  • John Hoecker

    For those using Universal Analytics with WordPress, I dropped the event tracking script into header.php just below the body tag and it is working for tracking downloads (haven’t checked for others types of events – I have an audio player that I’d like to track “play” clicks as well).

    I suspect the cleaner way is to create a function, but that is beyond my paygrade…

    Thanks Ryan!!

  • Art Thompson, Jr.

    This was the snag for me, too. I’m glad I found this comment, otherwise I would still be pulling what’s left of my hair out.

  • Aaron Weiner

    Ryan, could this code be implemented through the Google Tag Manager? If so, how would you do that?

  • Southeast Community College Ne

    Ryan, thanks for updating the code to work with universal analytics. I see the events being recorded while in Real-Time, but there is never any data for the view. No category, etc. Any idea what could cause that?

  • http://www.cheza.net Spotkick Challenge

    Thanks so much. This script is so useful.

  • http://www.pci-z.com/ bbanelli

    Greetings,
    since I had some issues, here is what worked for me:
    1.) Import JQuery in your body first
    2.) Place Universal Analytics code above /head tag
    3.) Put ga(‘send’, ‘event’, elEv.category.toLowerCase(), elEv.action.toLowerCase(), elEv.label.toLowerCase(), elEv.value, elEv.non_i); within your desired ‘a’ tags (it is working with onclick event)
    4.) Place script from this site just above /body tag, as said in comment from Mr. Joel Lowther!
    Hope this helps!

  • Ben

    In step #3, are you saying we need to add an onclick event to any link we want to track with the script?

  • Louise

    Does the “manual inline approach” referred to in the previous version of this article still work?

  • Bronwyn V

    oh my gosh Olaf, sooo sorry, had lost track of this. I did get this working, I cant remember what the exact issue was, however it was some funkiness in my site code.. not related to your script.

    Thanks :-))

  • NZ101

    Bit of an amateur query – but how do I activate the above on my Squarespace account? I can add code, but I’m not familiar with activating the above code through javascript – where/how do I host it and how do I link that to my site. Main goal is to track outbound links.

  • FreelanceWebdesignerNL

    Hey Ryan,

    Thanks for sharing this, i made my own but this is more complete.

    The only thing is that i am testing it now and i see in the real time overview that events are triggered. But it is not showing any information from these events, like category, action & label.

    Hope you can help.

    Kind regards,

    Robin

  • Tim Young

    I can not seem to get this script to work. I am using jquery 1.44.

    The old script I used withing the page
    _gaq.push(['_trackDownload']);
    _gaq.push(['_trackOutbound']);

    I thought the new script would be something like this
    ga(‘send’, ‘trackDownload’);
    ga(‘send’, ‘trackOutbound’);

    What I would really like to see the the full URL of the document being downloaded and I am getting nothing.

    I have tried placing the call to the J.S file before the GA code and after. Still nothing.

    Please help

  • http://www.blastam.com/ Olaf Calderon

    Hello Tim,

    I’m not sure where you get _gaq.push(['_trackDownload']); and the outbound version from.

    What you need to do is place the above code on the page, usually via an external javascript and across all pages along with your standard GA code.

    If you cannot update your jQuery then you’ll need to change line 8 to:

    jQuery(‘a’).click( function(event) {

    I would suggest you update your jQuery though –

    Aside from that, you don’t need anything else. This listener will capture click on anchor tags and analyze if they’re email, outbound or downloads, then fire the event.

    thanks,

  • http://www.blastam.com/ Olaf Calderon

    Hello Robin,

    I’m not sure why you weren’t seeing it in Real Time but removing the nonInteraction parameter will change how that hit is handled when it comes to bounce rate for the page.

    This is something you can definitely adjust across all three types of events we’re capturing here (external, download, email) However for an external click, we usually like to keep it as an non interaction hit so that clicks to external links don’t affect the bounce rate for that page. In the case of a download, we make it an interaction click so that people who download are not counted the same as people who do not download when trying to figure out the bounce rate.

    Example. You have a page with a download and an exit link.

    Typically, when the person gets there, if they click on the download and we fire an event, the event is the page’s second hit and thus is disqualified as a bounce even if the user leaves the page without any further action. This is the desired logic since we want to exclude pages where people downloaded an item from being counted as bounces.

    For an external click, we want to reverse the logic since you typically do not track external links and having no interaction on the page then clicking on an external link is in fact a bounce. For this reason we pass that event the non-interaction value of true, so that the hit is ignored as an interaction.

    You may want to recheck your code and make sure there isn’t something else that caused it to fail to work.

    thanks,

  • http://websbygeorge.com George Murphy

    Hi Guys,

    What is the absolute lowest version of jQuery that this script will work on? The site is pretty old. On one part of the site we are running 1.2.2 & 1.7.2

    Thanks,
    George

  • Tony Catchpole

    Hi.
    I am a bit of a newbie but have managed to get the code working and I am picking up all expected events when viewed in real time at GA. However, a click on a Paypal Buy Now button that goes to Paypal on the same page as the clicked button does not show up as an event. I will be grateful to know if anyone has solved this or whether the code is not designed to capture redirection events that do not open in a new window. Very useful code.

  • http://www.activeinventories.co.uk Tony C

    Hi.
    I am a bit of a newbie but have managed to get the code working and I am picking up all expected events when viewed in real time at GA. However, a click on a Paypal Buy Now button that goes to Paypal on the same page as the clicked button does not show up as an event. I will be grateful to know if anyone has solved this or whether the code is not designed to capture redirection events that do not open in a new window. Very useful code. (sorry to George for posting this first by mistake as a reply to your post)

  • http://www.ashnewport.com Ash

    Using the above code works as expected for file types but external links, mailto, and tel don’t.

    Mailto and tel do not report any events at all. Watching the traffic in the network console it says that HTTP request to Google Analytics was cancelled.

    External links do show up in the Events reporting but oddly they do not appear in Real Time. A marker on the second chart is registered but nothing is displayed in the table below.

    As an extra: what would be the best way to implement a click to register as a Pageview and an Event at the same time? E.g. click a PDF sends an Event as per the blog article code, but it also send /files/name.pdf as a Pageview. I’ve tried this which I think is working but I feel there could be a better way to implement the code:

    ga(‘send’,'event’, elEv.category.toLowerCase(),elEv.action.toLowerCase(),elEv.label.toLowerCase(),elEv.value,{
    ‘nonInteraction’: elEv.non_i ,
    ‘hitCallback’: function() {
    ga(‘send’,'pageview’, elPv.loc,{
    ‘nonInteraction’: elEv.non_i ,
    ‘hitCallback’:gaHitCallbackHandler
    });
    }
    });

  • Peter Tögel

    I seem to have issues with getting it to work.

    To clarify, …

    Where does the code above go? Inside the head tag or inside the body tag?

    In what order do we need the jquery, the code above and the Google Script Tracking Code?

    Do we need to tag the links somehow or is the script supposed to figure it out?

    Is there a sample HTML page where we can see it working?

    Peter



Goal Driven Online Marketing & Analytics
Copyright © 1999-2013 Blast Analytics & Marketing