WordPress and Google Analytics

Following on from my last post in which I describe how to include code snippets in WordPress posts, I also decided it would also be great to track visitors to my blog using Google Analytics. Fortunately, this was very easy to set up.

The first step is to create a Google Analytics account. This is easy and fully explained by Google so I won’t go into details here. Once you have created your account you should be able to see your tracking code, which for me looks like this:

<script type="text/javascript">// <![CDATA[

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-39305296-1']);
  _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>

To monitor your WordPress site using Google Analytics you simply need to open the editor under the ‘Appearance’ menu, select Footer (footer.php) and paste the entire tracking code block just before the closing body tag:

</body>

Once done, Google Analytics will monitor traffic to your site.

Addendum: Warning! Updating your WordPress theme will overwrite any customisations you have made to the files. So, if you run a WordPress auto-update, be prepared to have to re-paste the Google Analytics code in again.

Including code snippets in WordPress using Sunburst Code Prettify

I realised that if this blog is going to be effective I’m going to need to show code snippets in my posts. This is obviously something that WordPress doesn’t do out of the box. I experimented with a few options before settling on the Sunburst Code Prettify plugin. Unlike other alternatives that I tried, this plugin worked straight away with no extra configuration needed.

However, there was one annoying issue. When I entered the text below into a new post:

Prettify 1

…it rendered as:

Prettify 2

Notice that the quotes have been scrambled. A few minutes on Google later and I’d found the following great article that explained what was going on:

WordPress Stop Changing My Quotes

The solution for me was to add the following line of code to my “Theme Functions (functions.php)” file in the WordPress editor, right at the end of the file:

remove_filter(‘the_content’, ‘wptexturize’);

Doing this fixed the issue and my code renders correctly as follows:

using System;

namespace HelloWorld
{
    public static class Program
    {
        public static void Main(string[] args)
        {
            Console.WriteLine("Hello World");
            Console.ReadLine();
        }
    }
}

Update (3rd September 2013)
Having seen Scott Miller’s blog and had some great advice from him via email, I have since switched to using ‘pre’ tags to render my code snippets, so this article is now out of date. The ‘pre’ approach is simpler and results in cleaner looking cope snippets. Another benefit is that I haven’t found any character issues yet, although code containing tags (e.g. HTML and XML) does have to be encoded before it can be encased in the ‘pre’ tags.