As we know that mobile usage is increasing day by day, people had started surfing and searching via mobile for nearby places like restaurant or shopping mall. Similarly design and development of mobile website and its online presence to increase sales or get connected to customer had become advent day by day.
But main problem rose in tracking customer who had visited to site or through which search query they landed to site had become difficult, as Google Analytics uses JavaScript based code to track visitor’s data but few of mobile devices don’t support JavaScript. So Google bought new way to track mobile visitors using Google Analytics, which could be explained in blog post.
Google Analytics Tracking Code (GATC) for Mobile Websites
Steps to Install Google Analytics mobile tracking code
- Download the mobile tracking libraries from the Google Analytics code site at http://goo.gl/9q13i.
- 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 ("/").
- 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).
- 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'.
- Copy the contents of the #1 snippet to the very top of each web page you wish to track (above opening <html> tag).
- 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.
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("&", "&", $url);
}
?>
// 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("&", "&", $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 . '" />';?>
$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>
utmp=%2Ftesting%2Fmobile%2Findex.php&;guid=ON" />
</body>
</html>
