Scraping useful data into GA with user defined variables and GTM

8th November 2017

*This article is about Universal Analytics which will sunset on 1 July 2023 and be replaced with Google Analytics 4. You can find our GA4 content here.

One of the most powerful features of Google Analytics is the ability to add Custom Dimensions and Metrics into your existing Google Analytics data.

This can be very powerful. TNW reported using as many as 59 custom dimensions and metrics to better understand the impact of ad blockers, syndication, the differences in behaviour between signed in users and new users, and so on and so on.

Custom Dimensions can obviously add a great deal of depth for publishers, but they can also be very powerful for other types of businesses too.

The problem you’ll often encounter is a situation where a technical change is months away, and you need the data now. Fortunately, Google Tag Manager has a feature under User Defined Variables that allows you to extract data from HTML Elements in your webpages. This can be useful for things like:

A count of reviews on a product page
The number of product items on a category page
Whether a product is a sale item or not

And so on.

In this example, I’ll be showing you how to add stock status as a custom dimension in a retailer’s Google Analytics setup.

The challenge with this particular website was – like so many companies – a lack of resource to get a code change anytime soon. The data we needed wasn’t available in the site’s Data Layer, so the quickest solution was to set up a User Defined Variable to return the text of an HTML element and pass that to GA as a Custom Dimension.

This isn’t the perfect way to solve the problem – scraping the DOM is inherently risky, since changes to a site’s front-end can break your tracking. You’re far better off working from a Data Layer which has been structured according to business goals, and which is managed by stakeholders from across the different areas of the business. In our case, however, front-end changes were unlikely and the data was needed immediately.

Set Up Your User Defined Variable

We want to grab the stock status for a product from this website’s product pages. Those of you who use Woocommerce might see some familiar markup in here:

Grabbing stock status from ecommerce pages

Our stock status information is contained like so:

In stock and ready for dispatch

The solution looks a little like this.

In GTM, head to “Variables”, and click “NEW” under “User Defined Variables”.

Give your variable a name (I named mine “Stock Status”). Then, choose DOM Element as the variable type and CSS Selector as the Selection Method.

This will work:

But here’s slight curveball! An out-of-stock message is rendered with a different class value:

Out of stock

Luckily, you can combine multiple CSS classes in a single User Defined Variable using a comma separator. In this case, using a comma separator says create a data object from HTML elements with either of these classes.

You can call for this variable in a GTM tag using double curly brackets like this: {{Stock Status}}

Create a Custom Dimension in GA

At this stage you need to head to Google Analytics and create a hit-level Custom Dimension.

Here’s a useful how-to from Tom over at Moz: How to Measure Performance with Custom Dimensions in Google Analytics [Tutorial].

If you’re not sure how, here’s a helpful video:

Fire a Custom Dimension Tag in GTM

To fire a custom dimension via GTM, head to your Universal Analytics tracking tag. Expand “Custom Dimensions” under More Settings, and enter the index number and value of the dimension you’d like to set.

The Results

This is the All Pages report with my new Stock Status Custom Dimension selected:

Get some expert advice

As I mentioned before, you really should be getting your developers to construct a Data Layer rather than scraping your front-end. You should also have a proper data strategy, and really spend time thinking about the measurements in GA that could make a genuine impact on your business decision making.

I use Google Analytics on a needs / must basis, and while I can do some pretty cool stuff, it’s our data team that you really should be talking to.