By - Neal Cole

Why Adding Element IDs Enhances Google Tag Manager Capabilities

Adding element IDs helps get your website Google Tag Manager ready

 

Migrating from Google Analytics base code to Google Tag Manager provides you with a huge opportunity to enrich your web analytics data. However, this does require some planning and developer resource to ensure your website is Google Tag Manager ready. One priority for implementing Google Tag Manager is the addition of element IDs for assets which users interact with or that indicate a journey variant.

 

I have previously outlined the process for migrating from Google Analytics base code to Google Tag Manager for web analytics implementation. If you are yet to migrate to Google Tag Manager it is worth considering the benefits of GTM over hard-coded Google Analytics. These include:

 

      • Agility and control
      • Remarketing
      • Deployment cost
      • Site speed
      • Privacy

 

Creating tags to measure clicks and progress through a user journey without the assistance of a developer is one of the most useful aspects of Google Tag Manager. If your website already has IDs on page elements this can be accomplished relatively easily and quickly. However, many websites I come across don’t  have unique IDs on page elements and so they may be missing out on one of the most powerful aspects of GTM.

 

To check if your key call-to-actions have element IDs just right click on the element and select ‘Inspect’  to open the Developer console. Select the ‘Elements’ tab and you should be able to see the ID displayed as in the example below (id=”BUT_1234″). If not, you will need to get IDs added to your site.

 

Example of element ID for a button

 

1. Micro Conversions – Click IDs:

 

Adding unique element IDs enables Google Tag Manager to match a click with an individual asset, such as a call-to-action (CTA) button, input field or drop-down menu. Provided the element ID is unique to the page we can use a “All Element” trigger and a GA Event tag to capture the click ID.

 

A Click ID tag in Google Tag Manager

 

This means you can measure micro conversions on a page, especially with forms and buttons to understand where users drop out of a conversion funnel and what elements they interact with. The events can be used to configure custom segments which allow you to create complex funnel visualisation in Data Studio.

 

2. Form Analytics:

 

If you have a form analytics solution such as Zuko or a user experience tool like Hotjar, these rely on element IDs to identify individual fields on your form. These tools offer a mass of analytics on field completion rates, time to complete, form abandonment and other useful data to help you optimise your form. Adding unique element IDs will ensure you get the most out of these tools.

 

3. Visibility of Message or Image:

 

The mere-exposure effect means that users are more likely to be favourable to an  image or message they are familiar with. But how do you know if users have had the opportunity to see an image or message if they don’t click on it? Well, adding a unique ID to the element will allow you to measure how many times the asset appears in the user’s browser.

 

It will allow you to create an element visibility trigger to fire a tag to measure each time the image or message appears in the user’s browser. This allows you to create a custom segment to assess the effectiveness of the asset in influencing user behaviour or to target users with a related message.

 

 

4. Single Page Applications:

 

Many websites use single page applications (SPA) for sign-up forms, password reset and checkouts. Single page applications serve new content to users as they progress through a form without the need for the page URL to change. This is problematic for Google Analytics as it relies on a URL change to register that a new page has been served to the user.

 

A simple solution to this is to add unique element IDs to content and form fields on the single page application. This allows us to use an element visibility trigger to track user progress through the SPA

 

 

5. Logged In Users:

 

When a user logs into your site does it display their name, account number or some other indication that they are logged on? If a developer adds a unique ID to this element you can use this to create an element visibility trigger to identify when users are logged in our logged out. This can be used to create custom segments so that you can analyse behaviour by logged in status.

 

 

6. Conventions for Element IDs:

 

Before you ask developers to add unique element IDs to your site it’s worth giving them some guidance on what will work best for Google Tag Manager. For example, it’s important that each ID is unique to an individual page because you can differentiate between site-wide assets (e.g. Login buttons) by the page they are located on.

 

However, if you have two identical assets on the same page (e.g. a site-wide login button and another login button within your content), you would require different IDs for each. Some sites also have conventions for prepends and the format of IDs. For example, “BUT_” or “BTN_” would signify a button, “QUE_” a question and PIP for password.  Each prepend is then followed by a random generated number or in some case a description. Here are some conventions you can use:

      1. Button = “BTN_” followed by description or number  (e.g. “add-to-basket”).
      2. Question = “QUE_” followed by description or number (e.g. “date-of-birth-day”)
      3. Icon = “ICO_” followed by description or number (e.g. “terms-and-conditions”)
      4. Error message = “ERR_” followed by description (e.g. “incorrect-password”).
      5. Payment outcome = “PAY_” followed by description (e.g. “payment-declined”).
      6. Single page application = “SPA_”  followed by step description (e.g. “register-step-1”)

 

Click ID Lookup Table in Google Tag Manager

 

The benefit of setting conventions for element IDs is that it helps the analyst recognise the nature of the element. In addition, you can configure triggers so they only fire when the ID contains the expected prepend or fragment. It is also useful when populating Lookup Tables in GTM as it helps with recognition of the ID and may reduce the likelihood of putting the wrong type of ID in the Input field.

 

 

Conclusion:

 

Getting developers to add element IDs to assets that users interact with or signify a change in user status will enhance your ability to fully track user journeys in Google Analytics. Asking developers to  automatically add element IDs when they create new content is the best way to ensure new pages are  GTM ready.

 

Element IDs are a simple, but effective way of making GTM tagging more efficient and effective in tracking important user journeys. They also help you segment and target users according to the content they have had the opportunity to see in the browser. This can be used to enhance your capabilities for personalising the user journey and improve conversion rates.

 

  • About the author:  Neal  (@northresearch) provides web analytics and CRO consultancy services and has worked in many sectors including financial services, online gaming and retail. He has helped brands such Hastings Direct, Manchester Airport Group Online and Assurant  Solutions Ltd to improve their digital marketing measurement and performance.

 

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close