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):
  2. <?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>


  3. 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 ".
  4. Your SiteAnalytics config file should look something like the below:
  5. <?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>

  6. 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.)
  7. 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/

About these ads

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

  1. Franco says:

    Hello,
    nice post. There is a problem, however: the current dnn position on the GA code above the /head tag is positioned also above the page title tag. The effect is that the Analytics view ‘content by title’ is screw up, most of pages are now ‘not set’. Is there a way to tell dnn to place the title tag higher in the head section?
    Thanks

  2. PA says:

    Hey Franco,

    That’s weird – in my GA, I can view content by title without any problems. What version of DNN are you using? I’ve heard some people using 5.6.1 have had some issues with this method…

  3. Franco says:

    I see it on 5.6.1 and 5.6.2, not sure it if happens on earlier versions too.
    Perhaps this can solve it, but I have not tried it, as it involves changing the source code, I guess: http://blog.usmanahmed.info/?tag=titletag

    Franco


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

Follow

Get every new post delivered to your Inbox.