Sunday, October 30, 2011

How to Add Google Analytics on Mobile Websites?

Mobile phone usage has increased over years and people are using mobile phones for searching nearby places. Whether it be restaurant or shopping mall or something else everyone should have a mobile website or online presence to increase sales and connect with their customers.

Tracking of mobile website in Google Analytics differs from tracking a normal website because Google Analytics uses JavaScript based code to track visitors data but some mobile devices does not support JavaScript. So Google devised a new way to track mobile websites using Google Analytics. This blog post will provide you information on Google Analytics Mobile Tracking Code and steps to install it on your mobile website.

Let’s walk through the visitor tracking process for a PHP based mobile website.

To track a mobile site built in PHP, you must add a block of PHP code before the <HTML> tag on all your mobile pages. You must also add a small block of PHP code immediately before the closing </BODY> tag. (This is same even if your mobile website is based on jsp, aspx or pl)
Google Analytics for Mobile Websites
This is How Google Analytics Tracking Code Works for Mobile Websites

Google Analytics Tracking Code (GATC) for Mobile Websites

Before going through steps to install GATC- for Mobile Websites let’s examine the code
Examining the first block of PHP code, you’ll notice that you need to add your Web Property account number to the top of the block. You’ll also need to change the path to the ga.php file to match your website architecture:

<?php
// Copyright 2009 Google Inc. All Rights Reserved.
$GA_ACCOUNT = "MO-XXXXXX-YY";
$GA_PIXEL = "/ga.php";
function googleAnalyticsGetImageUrl() {
global $GA_ACCOUNT, $GA_PIXEL;
$url = "";
$url .= $GA_PIXEL . "?";
$url .= "utmac=" . $GA_ACCOUNT;
$url .= "&utmn=" . rand(0, 0x7fffffff);
$referer = $_SERVER["HTTP_REFERER"];
$query = $_SERVER["QUERY_STRING"];
$path = $_SERVER["REQUEST_URI"];
if (empty($referer)) {
$referer = "-";
}
$url .= "&utmr=" . urlencode($referer);
if (!empty($path)) {
$url .= "&utmp=" . urlencode($path);
}
$url .= "&guid=ON";
return str_replace("&", "&amp;", $url);
}
?>


The second block of PHP code is much simpler. It is simply two lines of PHP code that reference a function in the first block of code:
<?php
$googleAnalyticsImageUrl = googleAnalyticsGetImageUrl();
echo '<img src="' . $googleAnalyticsImageUrl . '" />';?>
When both blocks of PHP work, the result is an image tag at the bottom of every page on your mobile website. The resulting HTML looks something like this:

<img src="/ga.php?utmac=MO-XXXXXX-YY&;utmn=669391585&;utmr=-&;
utmp=%2Ftesting%2Fmobile%2Findex.php&;guid=ON" />
</body>
</html>

Steps to Install Google Analytics mobile tracking code

  1. Download the mobile tracking libraries from the Google Analytics code site at http://goo.gl/9q13i. 
  2. Extract the contents of googleanalyticsformobile.zip file and copy ga.php (or ga.aspx, ga.jsp, ga.pl etc) into the root folder of your website ("/").
  3. Create Google Analytics account profile for your mobile site at www.google.com/analytics. Select "tracking for a new domain" (or new subdomain, if applicable), and enter mobile website name. Do not download JavaScript based tracking code but keep the web property ID (eg: UA-12345-01).
  4. There should be two files ending in .snippet. Open #1 (i.e. php1.snippet) in a text editor and insert the Web Property ID from step 1 in place of the text 'Account ID Goes Here', also replace 'UA-xx' with 'MO-xx'.
  5. Copy the contents of the #1 snippet to the very top of each web page you wish to track (above opening <html> tag).
  6. Copy the contents of the #2 snippet to the bottom of each web page you wish to track, just before the </body> tag. Refer to the included sample web page if needed.

Let me know if this was useful for you. 





Share and Discuss

0 comments:

Post a Comment