How to set up Google Analytics asynchronous tracking in DotNetNuke (the ‘new’ version of the GA tracking code)

The open source DotNetNuke content management system is hugely versatile and pretty powerful. If you haven’t used it before, (unsurprisingly) it’s written in .net and has a raft of third party modules to enhance it’s functionality, many of which are superb.

I encountered a problem recently though. While DNN has a built in ‘Google Analytics’ Admin module that allows you to add GA tracking to every page, it adds the code in the traditional tracking format, which has since been superceded by the superior asynchronous tracking.

The traditional code looks like this:

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try{
var pageTracker = _gat._getTracker("UA-xxxxxx-x");
pageTracker._trackPageview();
} catch(err) {}</script>

Whereas the newer asynchronous code looks like this:

<script type="text/javascript">

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

Quite a difference, no?

On top of all this, the asynchronous code should sit just before the </head> tag, whereas the traditional code (and thus the DNN Admin function) sits it just before the </body> tag.

To set up asynchronous tracking on DotNetNuke, we need to make some changes to the SiteAnalytics.config file that is located in the root of your DNN installation (goes without saying but always take backups of any files you are making significant changes to).

1. Open SiteAnalytics.config (located in the root of your DotNetNuke installation. It will look something like the below (the parts we will need to change are highlighted in red, green and amber):

<?xml version="1.0" encoding="utf-8" ?>
<AnalyticsEngineConfig>
<Engines>
<AnalyticsEngine>
<EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
<ElementId>Body</ElementId>
<InjectTop>False</InjectTop>
<ScriptTemplate>
<![CDATA[
<script type=”text/javascript”>

var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try{
var pageTracker = _gat._getTracker("[TRACKING CODE]");
pageTracker._trackPageview();
} catch(err) {}</script>
]]>
</ScriptTemplate>
</AnalyticsEngine>
</Engines>
</AnalyticsEngineConfig>




2. Change the Element ID (highlighed in red) to ‘Head’ and the analytics tracking code (highlighted in green) to the asynchronous Google Analytics tracking code, replacing “[TRACKING CODE]” (highlighted in amber) to your website’s individual tracking ID, in the format ‘UA-XXXXX-X’. Note that asynchronous tracking uses ‘ around the code instead of “.
3. Your SiteAnalytics config file should look something like the below:

<?xml version="1.0" encoding="utf-8" ?>
<AnalyticsEngineConfig>
<Engines>
<AnalyticsEngine>
<EngineType>DotNetNuke.Services.Analytics.GoogleAnalyticsEngine, DotNetNuke</EngineType>
<ElementId>Head</ElementId>
<InjectTop>False</InjectTop>
<ScriptTemplate>
<![CDATA[
<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXX-X']);
_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>]]>
</ScriptTemplate>
</AnalyticsEngine>
</Engines>
</AnalyticsEngineConfig>

4. Now log in to your Admin control panel on DotNetNuke and navigate to the Google Analytics module. Enter your GA tracking ID and click update. (Note: entering your GA tracking ID here is required to trigger the module to add to every page: because we’ve hard coded the SiteAnalytics.config file with your GA tracking ID already, it isn’t populating it with the value you are entering on the GA module page. Not ideal I know, but it works perfectly none the less.)
5. Hey presto! You now have Google Analytics asynchronous tracking on your DotNetNuke website.

It’s important to note that if you re-install DotNetNuke, you will have to update the SiteAnalytics.config file, as it will be restored to it’s default otherwise.

One quick note: I’ve not tested this thoroughly, but it looks as though Google Analytics tracks visits even when you are logged in as Admin. There’s a simple fix to this: log in to your Google Analytics account, choose your website profile, click ‘edit’ and add a filter to exclude all traffic containing the subdomain /Admin/