Tracking Exits to External pages in Google Analytics


Depending on what implementation of Google Analytics you have installed on your site, these steps may be different for you, these instructions are based on the Analytics.js implementation, if you use a different implementation refer to the Google Analytics devguides.


What data can I track with Google Analytics Events


Google Analytics Events allow you to track the following information about a click or interaction on your website:

  • Category - A category name
  • Action - The action that has occurred
  • Label - The data you'd like to collect

The values for each of these parameters can be changed as needed, you might have an event category of "LaunchVideo" and an action of "play", or you may want to capture clicks to outbound websites and have a category of "outbound" and an action of "clicks", your label parameter can then store the URL they clicked on.

Capturing clicks on links to outbound websites


To capture clicks on outbound websites you will need to implement some code on your website that will take care of this process, the following script sends the data off to Google analytics, you will need to add this into your sites code. 

<script>
/**
* Function that captures a click on an outbound link in Analytics.
* This function takes a valid URL string as an argument, and uses that URL string
* as the event label. Setting the transport method to 'beacon' lets the hit be sent
* using 'navigator.sendBeacon' in browser that support it.
*/
var captureOutboundLink = function(url) {
   ga('send', 'event', 'outbound', 'click', url, {
     'transport': 'beacon',
     'hitCallback': function(){document.location = url;}
   });
}
</script>

Once you've added that code you can then trigger the event by adding an onclick event handler onto your links on your page, the following is an example:

<a href="http://www.microsoft.com" onclick="captureOutboundLink('http://www.microsoft.com'); return false;">visit microsoft.com</a>

With that code added you are now tracking event on your website!

Capturing different events


If you need to capture a range of different events on your website you could change this code slightly as follows:

<script>
/**
* Function that captures a click on an outbound link in Analytics.
* This function takes a valid URL string as an argument, and uses that URL string
* as the event label. Setting the transport method to 'beacon' lets the hit be sent
* using 'navigator.sendBeacon' in browser that support it.
*/
var captureOutboundLink = function(category, action, label) {
   ga('send', 'event', category, action, label, {
     'transport': 'beacon',
     'hitCallback': function(){document.location = url;}
   });
}
</script>

Then your onclick event would be:

<a href="http://www.microsoft.com" onclick="captureOutboundLink('outbound', 'click', 'http://www.microsoft.com'); return false;">visit microsoft.com</a>

Tracking events in a Google Analytics Dashboard

Once you have your code on your website and the data being tracked you can then pull that data out using dashboards, if you haven't set one up before check out my post Creating Custom Google Analytics Dashboards

Select your widget type, select Total Events for the metric, then add filters as needed, in the following example I have added a filter for the Category, action, and Label.





Was this helpful?

Yes No


Comments