Interactions and Goal Tracking with Google Tag Manager – Technical Best Practices for Developers

As you know, Google Tag Manager is a tool that helps Online Marketing people to set up different kind of user interaction and conversion tracking without the help of developers. This separation of roles is beneficial for both developers (no tedious updates of click events) and marketing staff (no dependency to IT), however it only works if web developers prepare the website according to best practices.

This is a document for developers to understand better the life of an Online Marketing staff that is in charge of setting up and maintaining Google Tag Manager click events.

So what do Online Marketing people want to do with Google Tag Manager?

Here is a typical Google Tag Manager (GTM) use case:

  • GTM managers would like to set up the tracking of a range of goals in Google Analytics so that business can see interaction and conversion trends and online marketing can optimise their campaigns based on these signals.
  • GTM managers would like to set this up in Google Tag Manager so that online marketing and business can wire the conversion and interaction signals to their tags and update the wiring quickly and independently from website deployment schedules.

Typical GTM Troubles that Online Marketing Managers have

Below is a list of technical things that sometimes make the life of a GTM manager tough.

1) Link Clicks Triggers don’t fire

  • Sometimes, GMT managers set up click triggers for buttons and the click triggers don’t fire.
  • Here is an example of a typical click trigger on a submitt button on a page like /booking?date=2019-01-01:
  • This is the button:
  • Here is the markup of the button:
  • However the GTM manager notices that this click trigger doesn’t fire.
  • Note: The button click tracking does fire if GTM managers configures the trigger with the button text only (Click Text) == ‘SEND REQUEST’
  • In this specific case GTM managers would like to be able to use the parent element (button with type == submit) because this is less ambiguous and more bullet proof and simpler to set up and maintain.
  • In such cases, when this doesn’t work as intended, maybe this is the cause: https://www.simoahava.com/gtm-tips/fix-problems-with-gtm-listeners/
  • Developers can help GTM managers having a simpler and more solid tracking setup by letting click events bubbling up in all cases.

2) No ids or distinguishing classes for important interaction elements

  • Currently important interaction elements such as buttons are not easily identifiable by business / online marketing staff when working with GTM.
  • An ID or a class name like “booking-date-time-step-continue” would simplify tracking setup.
  • Developers can help us simplify tracking by proactively setting ids or identifiable classes on important interaction elements.

3) No dataLayer information for transactional events

  • For some tracking cases GTM managers would like to measure more than a click. Example: a booking. In this case, it would be safer to get a signal from the backend that the booking has correctly been processed and is valid. This helps us prevent wrong trackings, for example if GTM managers would track the click on the ‘book now’ button, and there were form validation errors, GTM managers would still track a successful booking even if the website would not.
  • In order to help us track conversions correctly, you can use Google Tag Manager’s dataLayer.push() method.
  • Example:  dataLayer.push({'event': 'event_name'});
  • See documentation here: https://developers.google.com/tag-manager/devguide
  • Use a speaking and unique event name such as “booking-button-send-request” (similar to html ids)
  • You can push additional information by adding arbitrary properties and values to the object.
  • It helps the GTM managers if you document these event names and additional attributes in a Google spreadsheet that you share with them.