Migration of Classic Analytics (ga.js) to Universal Analytics (analytics.js) with Google Tag Manager

People are creatures of habit, and although sometimes the grass seems greener on the other side of the fence, we tend to stick to things we know. That’s sometimes the case when we tend to postpone migration of our Google Analytics installation from Classic Analytics (ga.js) to Universal Analytics (analytics.js) (and to leverage Google Tag Manager).

The bigger the number of Events and Virtual Pageviews coded inline within the page, the bigger the problem with migration. When we have dozens or hundreds of elements coded in ga.js it might take months for an IT team to rewrite all of those codes in analytics.js. This might also lead to the loss of some parts of the data.

In this article I will present a solution that might solve this problem (at least temporarily), and give your IT team enough time to migrate the installation without losing parts of the data.

Challenge

In one of our clients’ accounts, the entire tracking had been implemented by using Classic Google Analytics (ga.js) codes. All of the codes had been implemented inline which hampered the development of implementation as every tracking expansion had to go through the IT department. Another disadvantage was that our client couldn’t leverage the full potential of any of the new features that are now available in Universal Analytics.

In order to tackle this challenge, we decided to upgrade the entire tracking to the Universal Analytics (analytics.js) code library through Google Tag Manager.

While migrating the installation we encountered a problem when we tried to upgrade the events codes. There were almost 180 events implemented on this page, coded inline that tracked many different interactions:

_gaq.push(['_trackEvent', 'Category', 'Action', 'Label', 'Value', true])

These events were also used for setting custom variables, for example, with information about the status of the user’s login. Rewriting all of these codes from ga.js to analytics.js would have taken a lot of time that the client’s IT team did not then have. Any delay in the migration process would have resulted in a situation in which the events would not have been reported to Google Analytics, creating a lack of complete data for analysis.

We tackled this challenge by implementing a universal script that captured all of the events, virtual pageviews and custom variables coded inline and passed them to Google Tag Manager. How did we achieve that?

To implement the tracking of all these events via Google Tag Manager, first we needed to move all of the elements such as Category, Action etc. to dataLayer by using dataLayer.push, which looks as follows:

dataLayer.push({'event': 'GAEvent', 'EventCategory': 'Category‘, 'EventAction': 'Action', 'EventLabel': 'Label', 'EventValue': 'Value', 'EventInteraction': 'true or false'});

We encountered a similar situation with Virtual Pageviews and Custom Variables, coded ga.js:

1. Virtual Pageviews:

_gaq.push(['_trackPageview', '/virtual_pageview.html']);

2. Custom Variables:

_gaq.push(['_setCustomVar',1,'Log-in','Yes',2]);

These codes should also be pushed to dataLayer, so they can be passed to Google Analytics using Google Tag Manager:

1. Virtual Pageviews:

dataLayer.push({'event': 'GAPageview', 'pageview': 'value for example /virtual_pageview.html' });

2. Custom Variables:

dataLayer.push({'event': 'GAEventCustomVar', 'CustomVarIndex': <Index of Custom Variable for example 1>, 'CustomVarName': '<Name – for example ClientId>', 'CustomVarValue': '<Value – for example ‘Yes’ >', 'CustomVarScope': <Scope of Custom Variable for example 2>});

An additional case that needed to be taken care of was Event and Virtual Pageview pushed at the same time:

_gaq.push(['_trackEvent','Category', 'Action','Label', 'Value'],['_trackPageview', '/virtual_pageview.html']);

To avoid a costly and time-consuming process of rewriting all of the Events, Virtual Pageviews and Custom Variables from ga.js to dataLayer pushes, we decided to find another solution, which would enable the automatic conversion of specific codes and thereby create a painless migration.

The solution – a script passing events coded in Classic Analytics (ga.js) to Google Tag Manager

The solution we found and implemented was creation of a JavaScript which automatically converts Events, Virtual Pageview and Custom Variables coded in ga.js to dataLayer pushes that can be tracked via Google Tag Manager and reported to a Google Analytics account that was previously migrated to analytics.js.

Script:

<script type="text/javascript">

var _gaq =[];
var dataLayer = dataLayer || [];

_gaq.push = function (){
	for (var i = 0; i < arguments.length; ++i) {
		DataLayerProcessor.triggerEvent.apply(null, arguments[i])
	}
    return Array.prototype.push.apply(this,arguments);
}

var DataLayerProcessor = {
	triggerEvent: function() {
		switch (arguments[0]) {
			case "_trackEvent":
				DataLayerProcessor.sendTrackEvent.apply(null, arguments)
				break;
			case "_trackPageview":
				DataLayerProcessor.sendPageView.apply(null, arguments)
				break;
			case "_setCustomVar":
				DataLayerProcessor.sendCustomVar.apply(null, arguments)
				break;
		}		
	},

	sendTrackEvent: function() {
		dataLayer.push({
	         'event' : 'GAEvent',
	         'EventCategory' : arguments[1],
	         'EventAction' : arguments[2],
	         'EventLabel' : arguments[3],
	         'EventValue' : arguments[4],
	         'EventInteraction' : arguments[5]
	     })
	},
	sendPageView: function(){
		dataLayer.push({
	         'event' : 'GAPageview',
	         'pageview' : arguments[1]
	     })
	},
	sendCustomVar: function(){
		dataLayer.push({
	         'event' : 'GAEventCustomVar',
	         'CustomVarIndex' : arguments[1],
	         'CustomVarName' : arguments[2],
	         'CustomVarValue' : arguments[3],
	         'CustomVarScope' : arguments[4],
	     })
	}

}
</script>

Script implementation and configuration of Google Tag Manager

1. The script should be placed on every page before the GTM container for example in the <head></head> part as close to the top as possible within the structure of the page, because if some events are triggered before the script loads they will not be tracked.

2. To make the whole thing work properly we also need to remove the ga.js main tracking code.

3. In Google Tag Manager you need to create 3 tags, which will be responsible for passing Events, Custom Variables and Virtual Pageviews to Google Analytics.

Google Tag Manager tags

4. The GAEvent tag type, should be set for Event with Category, Action, Label, Value and Interaction configured as Variables

a.Tracking

Google Tag Manager GAEvent tracking

b. The Variable type, should be set for Data Layer Variable, for EventCategory, EventAction, EventLabel, EventValue and EventInteraction

Google Tag Manager GAEvent Data Layer Variable

c. The Trigger, which will fire a tag at the right time.

Google Tag Manager GAEvent The Trigger

5. Similarly, we configure the tags for Virtual Pageviews and Custom Variables.

Your job of migration to Universal Analytics could not have been easier

Sooner or later, each and every Google Analytics installation will have to be migrated from ga.js to analytics.js, either directly or via GTM. Depending on the number of tracked elements such as Events, Virtual Pageviews or Custom Variables, migration can be more or less time-consuming and costly. The script presented in this article is a solution that allows the automatic conversion of Events, Virtual Pageviews or Custom Variables coded in ga.js to dataLayer pushes that can be handled via Google Tag Manager and reported to a Google Analytics account that was previously migrated to analytics.js.

Although the script works as intended, this should only be a temporary solution. However, thanks to this script, we were able to maintain the data quality that was reported during the period of migration and it also gave the client’s IT team the time necessary to delete all of the Classis Analytics scripts and enabled us to implement the tracking using Google Tag Manager.

If you need an audit of your current analytics tool (Google Analytics, AT Internet, Adobe Analytics or Webtrends), you would like to set up a comprehensive data quality assurance process or migrate your current Google Analytics implementation to Universal Analytics, contact Mavenec today to learn more about our approach to ensuring data quality.

Psst. If you want to lift your conversion rate (and I am sure you are) you might be interested in our Free Ultimate Conversion Rate Optimization Toolkit where we reveal our conversion rate optimization secrets in a set of actionable guidebooks — check it out!.

Author: Karol Liszczyk

I am a dedicated digital analyst with passion for coming up with actionable recommendations. I just love learning new things which I highly pursue (hopefully digital analytics is a great field for that as it is a constantly developing environment and relatively new area of business). But analytics is not my whole life… in the meantime I enjoy cooking.


x

Grow Your Conversion Rate

Get your free copy of Ultimate Conversion Rate Optimization Toolkit:

Get Yout Free Copy Now
Read previous post:
Why Google Analytics Implementation Should Not Be a One-time Project?

If you want to make good business decisions on the basis of Google Analytics data, you have to be 100%...

Close