Call Tracking: How To Track Phone Calls in Google Analytics

There was a period of time, way way back, when I was just getting started in digital marketing and while I understood the importance of conversion tracking and using Google Analytics I’d felt like something was missing. You see I was tracking contact form enquiries, newsletter signups and all of those standard conversions, that most can master quickly, but I was frustrated because I knew I was missing out on critical call data to paint the full picture.

I was sure of one thing, I wanted to talk in the business language and rather than report on vanity metrics such as rankings and clicks, which businesses owners often glaze over, I wanted to highlight exactly how my websites and digital campaigns were increasing leads and sales.

I had to find a solution to track this data.

If your a business owner then the fact that you’re reading this means you understand the need to have the right data in front of you so you can make informed decisions about your digital campaigns. No matter what your business tracking phone calls is a must have and no longer optional. Since implementing call tracking on clients website I can’t believe the data I’ve been missing out on.

The article focuses on click to call tracking and while it’s not a perfect solution, it’s a good starting point. Let me explain, what happens with click to call is you’re tracking when a visitor clicks on a phone number on your website and in most case that will be mobile visitors. If a visitor decides to pick up up the phone and call you directly, without any click, then you still won’t track the conversion.

If it’s important for you to track all calls, including click to call or view to call, you need to look at a solution like Call Rail or Jet Interactive, Call Rail is what I’m now using on this website and I highly recommend it. Super easy to setup and to get started for any level of experience, if you don’t want to miss any of your data which is what I recommend then this is for you.

So let’s talk about how we set this up.

UPDATE – Global Site Tag (gtag.js)

More recently Google has implemented the Google Site Tag or gtag.js and is now the default tracking code Google Analytics will show in your account.  Gobal Site Tag is a JavaScript tagging framework which Google is using to create a unified tag for  AdWords, DoubleClick, and Google Analytics.

Instead of having to manage multiple tags for different products, you can use gtag.js and more easily benefit from the latest tracking features and integrations as they become available. The tag looks something like the below.

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-87097418-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', '<INSERT TRACKING ID>');
</script>

Sending events with GTAG

If you’re site is using gtag.js then you’ll want to use the following codes on your telephone links to track any clicks.

Examples of universal events

Basically the format of sending an event looks a little like this:

• gtag(‘event’, ‘contact’, { event_category: ‘phone call’, event_action: ‘click’})
• gtag(‘event’, ‘contact’, { event_category: ‘phone call’, event_action: ‘click’,event_label:’contact page’})
• gtag(‘event’, ‘contact’, { event_category: ‘phone call’, event_action: ‘click’, value:’100′}) // value is a number.

Universal Analytics

Around October 2012 Google announced that it would be switching from their pre-existing classic tracking code and switching to their new and upgraded Universal analytics. I’m not going to deep dive in this post on what exactly changed however just know that it was a complete overhaul of the tracking code.

So why does this matter? Good question! The most important of all this was the fact that the tracking code was modified and the way that we send events to Google analytics, such as onclick, was now in a different format. The thing is that many websites are still running the legacy code so if you want to configure any type of event tracking within Google you first need to understand whether you’re using classic or universal.

Shown below is an example of universal tracking code. Basically what you’re looking for is reference to the file “analytics.js” and if you can see that then you know you’re using the universal code.

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', '<INSERT TRACKING ID>', 'auto');  
  ga('send', 'pageview');

</script>

Sending events in Universal Mode

Alright so now that you’ve confirmed that your analytics code is loaded on every page of your website we need to understand how we’re going to send an event to your Google analytics account so that we can then configure goals to track phone call clicks.

Now remember what I said, you must ensure you know which version of analytics you’re using in order to use the right code to send events. For more information take a look at the article from Google and it will help you gain a better understanding of events.

• https://developers.google.com/analytics/devguides/collection/analyticsjs/events

Examples of universal events

Basically the format of sending an event looks a little like this:

• ga(‘send’, ‘event’, ‘category’, ‘action’);
• ga(‘send’, ‘event’, ‘category’, ‘action’, ‘label’);
• ga(‘send’, ‘event’, ‘category’, ‘action’, ‘label’, value); // value is a number.

In our case you’ll typically find that send and event are always the same and then you’ll just want to change the category, action and then potentially dive into labels and values if you need some greater definition of your events. In our case I’ll keep it simple and just stick with the category and action for now

Tracking clicks on Phone Numbers

Alright so this is the moment you’ve likely been waiting to see, tracking the actual click. Let’s take a look at an example:

<a href="tel:<INSERT PHONE NUMBER>" onclick="ga('send','event','phone call','click');"><INSERT PHONE NUMBER></a>

The code shown above is what you’ll need to place across your website every time a phone number is shown. This code is very simple, first we create a link using the <a> tags and then we configure the onclick event. The onclick event is used to send an event to Google analytics with a category of “phone call” and an action of “click” for whenever that particular phone number is clicked.

We’re tracking the clicks because it’s very common, especially with responsive websites, that a user will view your website on a mobile phone and then click to call. Once this code is in place for all your phone numbers all you’ll need to do is configure the goal in Google analytics.

Classic Analytics

Now if you’re still in old world then you’ll be using the classic analytics code. You can see the difference by looking for the reference to “ga.js” and also the fact that there will be no reference to the “analytics.js” file that we’ve mentioned above. If you haven’t updated your code for a period of time or you have limitations across your website that won’t allow you to migrate to the new code yet then this is what you’ll see.

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', '<INSERT TRACKING ID>']);
  _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>

 Sending events in Classic Mode

Again, if you’re using the classic mode then take a look at the following article from Google for some additional insight:

• https://developers.google.com/analytics/devguides/collection/gajs/

Examples of classic events

If you’re sending events in Classic Mode then it’s going to look something like this:

• _trackEvent(category, action, opt_label, opt_value, opt_noninteraction)

Tracking clicks on Phone Numbers

So just like the previous example you’re going to have to go through and replace all contact numbers with the following code. Again this code is saying that when the link is clicked send an event to Google analytics with the category of phone calls and the action of click.

 <a href="tel:<INSERT PHONE NUMBER>" onclick="_gaq.push(['_trackEvent','phone calls','click']);"><INSERT PHONE NUMBER></a>

 Simple right?

Yoast Analytics Implementation

**Please note since writing this article i’ve since confirmed that the correct method for sending events using Google Analytics by Yoast is to use the following method which references __gaTracker. If you only use ga it will not work. – “_ gaTracker(‘send’, ‘event’, ‘category’, ‘action’);“

Just to make it even more confusing I’ve found that some WordPress plugins such as Google Analytics by Yoast implement the Google analytics code slightly different to the one that Google provides. I haven’t dived far enough into the technical specifications of the analytics code to be able to understand which method is right or wrong but I’m going to presume that Google knows the right way.

What I do know however is that while using Yoast analytics I had trouble receiving any events using the universal method for sending. Now in saying that the Yoast analytics tool does allow for you to use classic or universal and in order to switch to universal you must tick the box. In my case this was already done however for some reason events were not sending still.

In the end I removed the code and embedded the code directly from Google and all of a sudden the events started to appear. If you’re having trouble implementing any of this guide then try disabling any plugins you’re using to embed the analytics code and add it directly from the Google analytics console.

Here is an example of the Yoast implementation

<script>

	(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
		(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
		m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
	})(window,document,'script','//www.google-analytics.com/analytics.js','__gaTracker');

	__gaTracker('create', 'UA-XXXXXXXX-X', 'auto');
	__gaTracker('set', 'forceSSL', true);
	__gaTracker('require', 'displayfeatures');
	__gaTracker('send','pageview');

</script>

As you can see from the above there is a subtle difference where the tracking ID is embedded and it switches to using the _gaTracker vs the ga() method by Google.  From what I can gather these are just a variable and it shouldn’t matter what they’re named but like I said that’s out of scope for this article. Feel free to provide your advice in the comments below.

What it may mean is that instead of using ga(‘send’, ‘event’, ‘category’, ‘action’) you may need to use _ gaTracker(‘send’, ‘event’, ‘category’, ‘action’); instead.

If you’d like to hear more about Call tracking John from the Works Media podcast and I recently spoke about it in Podcast 27 – How to setup call tracking using Google analytics.

Conclusion

As mentioned at the start we’ve already been implementing this for for a number of PixelRush clients and the results clearly show the importance of call tracking. It drives home our prior advice, on keyword research, about the importance of ranking for largest amount of relevant organic search terms. It’s relevance + traffic = conversion increase. If you’re not tracking the right conversions, such as calls, how do you know what’s working?

Here is an example of just over thirty days using call tracking.

If you or your business needs assistance configuring call tracking on your website then don’t hesitate to get in touch.