Do you have a website but are not using any tool for web analytics? Would you like to, but you are missing a developer? Or you may have some analytics deployed, but since the developer tends to be busy with other tasks, each change takes a lot of time. Luckily there is a tool that solves this: Google Tag Manager.

Why do we need analytics?

If you are not using analytics, you might be interested in why you actually need them. That is why we will start with a simple example.

On the homepage, you have a so-called CTA (call-to-action) button. Such a button is one of the essential elements on a page – and the first step towards a visitor conversion. It can point, for example, to a page with a product order if you are selling something or to a form that enables asking questions with the possibility of consultation in case you are offering a service. Maybe many people click on this button but leave the website within the next step. In any case, you want and need the website visitors to click on this button because it is crucial for your business. If you find out that they don’t click the button often enough, it is an impulse to optimize the design or content of the website. At least you know where to look for an issue.

Web analytics will tell you how much or how little the visitors click on something. That is why you need an analytical tool on your website (for example, Google Analytics) and set up monitoring of so-called triggers that notifies you, for instance, about the click of a button by a visitor. This is mainly set up by the developer within the code. What to do if the developer cannot do it?

GTM: One script to rule them all

Google Tag Manager (GTM) is a tool for the administration of measurement code on websites.

It works based on so-called tags and rules. A tag can include a script for adding Google Analytics to the website or a specific trigger, such as clicking on a button or link or sending a form. The firing rules determine when the given tag is executed.

All tags and rules are stored within so-called containers. To run GTM on a website, creating a container and inserting its code into each page where you want to measure something is necessary. Suppose you want to use services such as Google Analytics and Hotjar on your website or monitor events. In that case, it is enough to have Google Tag Manager on your page, and the rest of the scripts are added directly within the interface. For simple measurements, such as in the example from the beginning, inserting the container’s code is the only step that needs to be done directly in the code.

Using the tags and rules, you can add different measurement codes to the website, which you would otherwise have to add to the page’s HTML code. You can manage everything directly in the GTM interface, so there is no need to involve the programmer.

Is it really that simple?

Yes and no. To send easy events, you only need basic knowledge of HTML so that you can select the correct identification for the event object from the code, such as a button that the user clicked on. Knowing JavaScript (or having a skilled developer) for more complex events is necessary.

We will look at the setup of a simple event in the example from the beginning.

You have a button which has something like the following HTML code:

You are interested in the part id=” cta-button”, specifically the part in the quotation marks. No two elements on the page should have the same id, so this is an unambiguous identification of our button.

How can you get to this code? You can try it out right away. Click the right button of your mouse and select “Inspect element”. Developer tools will open, and the highlighted line will represent the button. You copy the id of the button (text within the quotation marks) and open Google Tag Manager.

First, click on Variables → Configure and select the variable Click ID.

Through Rules→ New, create a new rule for clicking on an element and select as condition Click ID, where you insert the button’s id.

 

Save the rule and go to creating a tag.

Click on Tags→ New and ad tag type, and select GA4 Event or Universal Analytics, based on which version of Google Analytics you are using. Select the proper configuration (a tag that includes the ID of the Google Analytics service where you want to send the data). Into the field Event name, insert the name of the event that will be displayed within Google Analytics – in this case, for example, cta_button_click. In the Setup section, assign the rule you created and save the tag.

 

In the right-hand corner of the screen, there are two buttons. The button Preview will open a testing interface, where you can try to see whether the new rules and tags are working correctly. Test that clicking on our button triggers the tag. The changes are not public at this point and are only accessible through Preview. You still need to publish them through the Send button to apply the new setting to all visitors.

After that, you can just watch in Google Analytics how the people are clicking on the button.

cta button clicks

 

Google Tag Manager: And that’s it!

Setting up sending events on button click is this simple using the Google Tag Manager tool. In GTM, there are templates for different rules – apart from clicking on different elements, you can also easily measure the depth of scrolling, playing Youtube videos or displaying a specific element on a page. For more advanced measurements, you still need a developer, but thanks to Google Tag Manager, you can handle the basic events on your own. In case you would still need help with the setup of Google Tag Manager or events, let us know.

 

Sources

  1. Tag Manager overview https://support.google.com/tagmanager/answer/6102821?hl=en

Are you interested in working together? We wanna know more. Let’s discuss it in person!

Get in touch >