Google Analytics Tracking for Mobile Sites

Mobile sites are becoming extremely popular with businesses today. You could even argue that it’s catching up to Social Media as the “new buzzword” in Business Circles. My article is going to offer up one tip to make sure your new jQuery Mobile site is performing properly and getting the results you want.

Google Analytics Tracking for Mobile Sites is different than Tracking your Website. After all, the entire purpose of a Mobile Site is for quick, easy access for Mobile Customers. 99.9% of that traffic is looking for your Phone Number or Your Location, the customer has either already done a Google Search to find you or they are a direct visit.

So let’s track Clicks on Phone Numbers and Maps using Google Analytics. We assume you’ve already inserted the default Javascript into the header. Thats the code they give you with:

_gaq.push(['_setAccount', 'UA-XXXXXX-1']);

For this example, our business has multiple locations in the Tampa Bay Area and we want to track which city is receiving mobile visitor click-throughs. This data could be important for future mobile advertising, but mainly just so we know its an added service that our customers are using.

Our locations are separated by collapsible divs with a basic html a href link using “tel:813-XXX-XXXX” so the browser knows to render this link as a Phone Call. We’ve put each city inside a collapsible div to cut down on accidental phone calls, it does require an extra click to make a phone call but its better than receiving an accidental one which would skew our data. Below is our sample code for the entire DIV including our Google Analytics Event Tracking Code.

<div data-theme="a" data-collapsed="true" data-role="collapsible" class="ui-collapsible-contain">
    <h3>Tampa</h3>
    <p aria-hidden="true">
	<a href="tel:813-XXX-XXXX" onClick="_gaq.push(['_trackEvent', 'Phone', 'Clicked', 'Tampa Phone Call']);">Call 813-XXX-XXXX</a><br />
	XXX E Highway 92<br />
	Tampa, FL
    </p>
    </div>

Lets dissect the parameters of this Event. “Phone” is our Category, “Clicked” is our Action, and “Tampa Phone Call” is our Label. These parameters can be changed to whatever you like of course, but I recommend only changing the Label as needed. An example of another Category would “Map” or “Directions” if you posted a link to Your Google Maps Page.

Now lets see how this translates in Google Analytics. Under “Content” you will find “Events”. Without going through an entire Google Analytics lesson just click on “Top Events” and change “Viewing” to “Event Label”, you should see something similar to this:

Summary

Now we can tell how many customers wanted to drill down to specific city phone numbers rather than calling the Main 800 Number on our mobile home page. I hope this helps you increase your mobile customer tracking.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • Alex

    Awesome tip! Thanks so much!

  • Rich H

    This is great! I’m off to start adding this to my customers’ jQuery mobile sites right now.

  • James

    Great info. I added this to my mobile site, however I only get partial stats on my google analytics account, sometimes they get in very late or not at all.
    Anybody else experiencing this?
    Very frustating, as I don’t know whether I made a mistake or whether it’s due to delays.
    Anybody for hire (cheap? :-) to have a quick look at what I did?

  • Rog

    HI. Great article!! We are actually using an abbreviated phone number that is only 5 digit long. Google Analytics does not seem to want to track this, as the Event does not show up. Any ideas why this is/ around this?

    Thanks!

  • http://www.revitalagency.com Wayne Roddy

    @rog – if you’d like to email me, I’ll see what we can do about fixing that. Too many variables to troubleshoot over this comment section. Thanks.