Skip to content

Commit

Permalink
Merge pull request #194 from alphagov/remove-classic-analytics
Browse files Browse the repository at this point in the history
Remove Google Analytics classic
  • Loading branch information
edds committed May 26, 2015
2 parents f693c48 + 6ac330c commit ea34e8e
Show file tree
Hide file tree
Showing 9 changed files with 145 additions and 474 deletions.
3 changes: 1 addition & 2 deletions Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,9 +30,8 @@ module.exports = function(grunt) {
javascripts: {
src: [
'node_modules/jquery-browser/lib/jquery.js',
'javascripts/govuk/analytics/google-analytics-classic-tracker.js',
'javascripts/govuk/analytics/google-analytics-universal-tracker.js',
'javascripts/govuk/analytics/tracker.js',
'javascripts/govuk/analytics/analytics.js',
'javascripts/**/*.js'
],
options: {
Expand Down
46 changes: 15 additions & 31 deletions docs/analytics.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,23 +2,20 @@

The toolkit provides an abstraction around analytics to make tracking pageviews, events and dimensions across multiple analytics providers easier. Specifically it was created to ease the migration from Google’s Classic Analytics to Universal Analytics. It includes:

* a Google Analytics classic tracker
* a Google Analytics universal tracker
* code to asynchronously load these libraries
* a generic Analytics tracker that combines these into a single API
* a Google Analytics universal tracker wrapper
* code to asynchronously load universal analytics
* a generic Analytics wrapper that allows multiple trackers to be configured
* sensible defaults such as anonymising IPs
* data coercion into the format required by Google Analytics (eg a custom event value must be a number, a custom dimension’s value must be a string)
* data coercion into the format required by Google Analytics (eg a custom dimension’s value must be a string)

## Create an analytics tracker

The minimum you need to use the analytics function is:

1. Include the following files from /javascripts/govuk/analytics in your project:
* google-analytics-classic-tracker.js
* google-analytics-universal-tracker.js
* tracker.js
* analytics.js
2. Copy the following `init` script into your own project and replace the dummy IDs with your own (they begin with `UA-`).
* Tracker.js accepts one or both analytics tracking code, so if you are only using one type of analytics (Classic or Universal) omit the one you don't need from the instantiation of GOVUK.Tracker. (NB you will still need to include both google-analytics-classic-tracker.js and google-analytics-universal-tracker.js in your project as they are currently loaded ahead of instantiation.)
* This initialisation can occur immediately as this API has no dependencies.
* Load and create the analytics tracker at the earliest opportunity so that:
* the time until the first pageview is tracked is kept small and pageviews aren’t missed
Expand All @@ -29,17 +26,16 @@ The minimum you need to use the analytics function is:
"use strict";

// Load Google Analytics libraries
GOVUK.Tracker.load();
GOVUK.Analytics.load();

// Use document.domain in dev, preview and staging so that tracking works
// Otherwise explicitly set the domain as www.gov.uk (and not gov.uk).
var cookieDomain = (document.domain === 'www.gov.uk') ? '.www.gov.uk' : document.domain;

// Configure profiles and make interface public
// for custom dimensions, virtual pageviews and events
GOVUK.analytics = new GOVUK.Tracker({
GOVUK.analytics = new GOVUK.Analytics({
universalId: 'UA-XXXXXXXX-X',
classicId: 'UA-XXXXXXXX-X',
cookieDomain: cookieDomain
});

Expand All @@ -61,7 +57,6 @@ Once instantiated, the `GOVUK.analytics` object can be used to track virtual pag

> Page tracking allows you to measure the number of views you had of a particular page on your web site.
* [Classic Analytics](https://developers.google.com/analytics/devguides/collection/gajs/asyncMigrationExamples#VirtualPageviews)
* [Universal Analytics](https://developers.google.com/analytics/devguides/collection/analyticsjs/pages)

Argument | Description
Expand All @@ -85,7 +80,6 @@ GOVUK.analytics.trackPageview('/path', 'Title');

> Event tracking allows you to measure how users interact with the content of your website. For example, you might want to measure how many times a button was pressed, or how many times a particular item was used.
* [Classic Analytics](https://developers.google.com/analytics/devguides/collection/gajs/eventTrackerGuide)
* [Universal Analytics](https://developers.google.com/analytics/devguides/collection/analyticsjs/events)

Argument | Description
Expand All @@ -112,45 +106,35 @@ GOVUK.analytics.trackEvent('category', 'action', {
});
```

## Custom dimensions and custom variables
## Custom dimensions

> Custom dimensions and metrics are a powerful way to send custom data to Google Analytics. Use custom dimensions and metrics to segment and measure differences between: logged in and logged out users, authors of pages, or any other business data you have on a page.
* [Classic Analytics](https://developers.google.com/analytics/devguides/collection/gajs/gaTrackingCustomVariables)
* [Universal Analytics](https://developers.google.com/analytics/devguides/collection/analyticsjs/custom-dims-mets)

Universal custom dimensions are configured within analytics. Classic custom variables rely on the javascript to additionally pass in the name and scope of the variable.
Universal custom dimensions are configured within analytics.

### Set custom dimensions before tracking pageviews

Many page level custom dimensions must be set before the initial pageview is tracked. Calls to `setDimension` should typically be made before the initial `trackPageview` is sent to analytics.

### Custom dimensions and variables must have matching indexes

When calling `setDimension`, the first argument (`index`) becomes the index of the Universal custom dimension as well as the slot of the Classic custom variable.

Argument | Description
---------|------------
`index` (required) | The Universal dimension’s index and and Classic variable’s slot. These must be configured to the same slot and index within analytics profiles.
`value` (required) | Value of the custom dimension/variable
`name` (required) | The name of the custom variable (classic only)
`scope` (optional) | The scope of the custom variable (classic only), defaults to a [page level scope](https://developers.google.com/analytics/devguides/collection/gajs/gaTrackingCustomVariables#pagelevel) (3) if omitted
`index` (required) | The Universal dimension’s index as configured in the profile.
`value` (required) | Value of the custom dimension

```js
// Set a custom dimension at index 1 with value and name
GOVUK.analytics.setDimension(1, 'value', 'name');

// Set a custom dimension with an alternative scope
GOVUK.analytics.setDimension(1, 'value', 'name', 2);
GOVUK.analytics.setDimension(1, 'value');
```

### Create custom dimension helpers

Because dimensions and variables rely on names and indexes being set correctly, it’s helpful to create methods that abstract away the details. For example:
Because dimensions rely on the correct index and that index doesn’t indicate its purpose, it’s helpful to create methods that abstract away the details. For example:

```js
function setPixelDensityDimension(pixelDensity) {
GOVUK.analytics.setDimension(1, pixelDensity, 'PixelDensity', 2);
GOVUK.analytics.setDimension(1, pixelDensity);
}
```

Expand All @@ -164,7 +148,7 @@ Pull `error-tracking.js` into your project, and initialise it after analytics (s

## Tracking across domains

Once a Tracker instance has been created, tracking across domains can be set up
Once an Analytics instance has been created, tracking across domains can be set up
for pages like:

```js
Expand Down
64 changes: 64 additions & 0 deletions javascripts/govuk/analytics/analytics.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
(function() {
"use strict";
window.GOVUK = window.GOVUK || {};

// For usage and initialisation see:
// https://github.com/alphagov/govuk_frontend_toolkit/blob/master/docs/analytics.md#create-an-analytics-tracker

var Analytics = function(config) {
this.trackers = [];
if (typeof config.universalId != 'undefined') {
this.trackers.push(new GOVUK.GoogleAnalyticsUniversalTracker(config.universalId, config.cookieDomain));
}
};

Analytics.prototype.sendToTrackers = function(method, args) {
for (var i = 0, l = this.trackers.length; i < l; i++) {
var tracker = this.trackers[i],
fn = tracker[method];

if (typeof fn === "function") {
fn.apply(tracker, args);
}
}
};

Analytics.load = function() {
GOVUK.GoogleAnalyticsUniversalTracker.load();
};

Analytics.prototype.trackPageview = function(path, title) {
this.sendToTrackers('trackPageview', arguments);
};

/*
https://developers.google.com/analytics/devguides/collection/analyticsjs/events
options.label – Useful for categorizing events (eg nav buttons)
options.value – Values must be non-negative. Useful to pass counts
options.nonInteraction – Prevent event from impacting bounce rate
*/
Analytics.prototype.trackEvent = function(category, action, options) {
this.sendToTrackers('trackEvent', arguments);
};

Analytics.prototype.trackShare = function(network) {
this.sendToTrackers('trackSocial', [network, 'share', location.pathname]);
};

/*
The custom dimension index must be configured within the
Universal Analytics profile
*/
Analytics.prototype.setDimension = function(index, value) {
this.sendToTrackers('setDimension', arguments);
};

/*
Add a beacon to track a page in another GA account on another domain.
*/
Analytics.prototype.addLinkedTrackerDomain = function(trackerId, name, domain) {
this.sendToTrackers('addLinkedTrackerDomain', arguments);
};

GOVUK.Analytics = Analytics;
})();
130 changes: 0 additions & 130 deletions javascripts/govuk/analytics/google-analytics-classic-tracker.js

This file was deleted.

Loading

0 comments on commit ea34e8e

Please sign in to comment.