Getting Real Time Visitor Stats to your WordPress.com blog through Google Analytics (and a little more!)

When I decided to create and maintain a blog, the first though that came to my mind was that I didn’t had the time neither to setup nor to support just another open source tool. I just wanted something to immediately start writing and posting and WordPress.com was the perfect solution. Everything is quick and easy here EXCEPT stats. They are awful, especially for someone like me that uses analytics for over 30 sites. I looked around but I found nothing about supporting google analytics to WordPress.com, and that is quite true, I couldn’t have full analytics support. The only thing I managed to do was to have real time visitor stats through google analytics (plus hits,pageviews,location etc), using a little hack and the google analytics image call. Nothing much, but I thought I should share and maybe some one else could find a better solution…

Supposing that this is your tracking 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', 'UA-xxxxxx-xx', 'wordpress.com');
  ga('send', 'pageview');
</script>

You just need to follow these steps:

1. Create a simple HTML with the title you want and the tracking code:



  <title>My CodePad | Fewer words, more code!</title>
  <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', 'UA-xxxxxx-xx', 'wordpress.com');
  ga('send', 'pageview');
  </script>



2. Save it as an .html and upload it to your server (or copy it to your localhost root directory):

Google Analytics, Save HTML

Google Analytics, Save HTML

3. Open it with Google Chrome and use Developer Tools to get the call to the image Google uses:

Google Analytics, Image Call

Google Analytics, Image Call

4. Copy it, and you will end up with a URL like this one (‘xxx’ are various numbers):

http://www.google-analytics.com/collect?v=1
&amp;_v=j7
&amp;a=xxxxxxxxxx
&amp;t=pageview
&amp;ht=xxxxxxxxx
&amp;dl=http%3A%2F%2Fwww.cybertiles.com%2Fanalytics.html
&amp;ul=en-us
&amp;de=ISO-8859-7
&amp;dt=My%20CodePad%20%7C%20Fewer%20words%2C%20more%20code!
&amp;sd=32-bit
&amp;sr=1440x900
&amp;vp=1440x428
&amp;je=1
&amp;fl=11.7%20r700
&amp;_utma=xxxxxxxx.xxxxxx.xxxxxx.xxxxxx.xxxxxxx.xx
&amp;_utmz=xxxxxxx.xxxxxxx.xx.x.xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
&amp;_u=MQAC~
&amp;cid=X.xxxxxxx
&amp;tid=UA-xxxxxx-xx
&amp;z=xxxxxxxxx

5. Edit the above URL and change the followings:

  • &dl=http%3A%2F%2Fwww.cybertiles.com%2Fanalytics.html
    This is the current url, you should change this whenever you need to add it to a new page, e.g. in every post. I changed it so to add it to the first page of my blog:
    &dl=http%3A%2F%2Fmycodepad.wordpress.com
  • &sd=32-bit&sr=1440×900&vp=1440x428l&ul=en-us&fl=Uknown&amp
    These are info about each visitor. Since you can’t have this, I just changed them to:
    &sd=Unknown&sr=Unknown&vp=Unknown&ul=Unknown
    * Althouth &je is just another info (java support), do not change it to something else than 1 or 0!!!
  • &_utma=xxxxxxxx.xxxxxx.xxxxxx.xxxxxx.xxxxxxx.xx
    &_utmz=xxxxxxx.xxxxxxx.xx.x.xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

    Info about user tracking, previous sites, cookies etc…
    Keep the numbers until the first dot:
    &_utma=xxxxxxxx&_utmz=xxxxxxx

You can find more about how these params work here: https://developers.google.com/analytics/resources/concepts/gaConceptsTrackingOverview
(just get “utm” off the name of the params listed there, and you will have yours)

6. Compose the url again and you should end up with something like this:

http://www.google-analytics.com/collect?v=1&amp;_v=j7&amp;a=xxxxxx&amp;t=pageview&amp;ht=xxxxxxx&amp;dl=http%3A%2F%2Fmycodepad.wordpress.com&amp;ul=en-us&amp;de=UTF-8&amp;dt=My%20CodePad%20|%20Fewer%20words,%20more%20code!&amp;sd=Unknown&amp;sr=Unknown&amp;vp=Unknown&amp;je=Unknown&amp;fl=Unknown&amp;_utma=xxxxxxx&amp;_utmz=xxxxx&amp;_u=MQAC~&amp;cid=xxxxxxxxx.xxxxxxxx&amp;tid=UA-xxxxxx-xx&amp;z=xxxxxxxxx

This is the final url you should call to hit google analytics. In order to call it each time a visitor opens your blog you can add it as the source of an image:

<img src="http://www.google-analytics.com/collect?v=1&amp;_v=j7&amp;a=xxxxxx&amp;t=pageview&amp;ht=xxxxxxx&amp;dl=http%3A%2F%2Fmycodepad.wordpress.com&amp;ul=en-us&amp;de=UTF-8&amp;dt=My%20CodePad%20|%20Fewer%20words,%20more%20code!&amp;sd=Unknown&amp;sr=Unknown&amp;vp=Unknown&amp;je=Unknown&amp;fl=Unknown&amp;_utma=xxxxxxx&amp;_utmz=xxxxx&amp;_u=MQAC~&amp;cid=xxxxxxxxx.xxxxxxxx&amp;tid=UA-xxxxxx-xx&amp;z=xxxxxxxxx">

and enter it to each blog post (if you want more details of each hit) or to a widget, like the following to track the entire blog:

Google Analytics, Text/HTML Widget

Google Analytics, Text/HTML Widget

* If you want to add it to each post it would be a good idea to change params &dl and &dt for each post, adding the post’s title and url. Also have in mind that since this uses just a static image, proxies may cache it and the call my never make it to google. Anyway, as you can see in the following image, I am tracking you!

Google Analytics, Real Time

Google Analytics, Real Time

Advertisements

One thought on “Getting Real Time Visitor Stats to your WordPress.com blog through Google Analytics (and a little more!)

  1. Pingback: HONDA JAZZ 2013 | JOK MOBIL KITA

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s