Google Tag Manager Addon

Google Tag Manager allows you to deploy analytics and measurement tag configurations to your experiences created at Dot.vu.

Enable Google Tag Manager Addon

To you use Google Tag Manager on an experience you create on Dot.vu, you must enable the Google Tag Manager Addon for that experience. Here’s how:

1. Open the Building Blocks on the left sidebar of the Editor
2. Search for “Google”
3. Drag the Google Tag Manager addon onto your project to enable it
4. Finally, set your Google Tag Manager Container ID from the account container you wish to use from Google Tag Manager (in a format similar to GTM-XXXXXXX).

That’s it! Once you save your changes, Google Tag Manager will be loaded with your experience.

You can now use Google Tag Manager tags configurations to setup general tags, but you can also look into Dot.vu specific events and variables as described below, and most importantly you can now define custom events.

Default Events And Variables

You can create Google Tag Manager tags with the following events and variables. These can be used directly from Google Tag Manager without adding any events to your Google Tag Manager Addon.

Events

dot-link-click-event – triggers when links are clicked

dot-button-click-event – triggers when buttons are clicked

Data Layer Variables

dotClickName – available on both events above. It provides the name that has been given to the clicked component.

dotClickText – available on both events above. Provides the button text if available, otherwise it provides the name given to the component, which can be edited in the Editor. This is because the click target can be other things such as images, shapes, popup closing buttons, and so on. If you want the component name instead, use the dotClickName variable.

dotClickUrl – only available when the dot-link-click-event triggers. Provides the URL for clicked links.

Custom Events

Interactive experiences go well beyond the usual patterns of web browsing, so it is important to define the right triggers to capture your metrics, so that you measure the success of those interactive experiences meaningfully.

Google Tag Manager already offers triggers like when a page loads, or when a CTA is clicked, but that is usually not enough. For example you may want to track how many users reached at least 80% of an interactive video, or to find from participants who finished a marketing game with a given score or higher how many subscribed

This is why Dot.vu provides you with the capacity to define custom event triggers on your Google Tag Manager Addon setting. Here’s how:

1. Go to your Google Tag Manager Addon settings and click Add event
2. From the Triggers with dropdown, select either a Key Performance Indicator (KPI) or Manual (Action)
   • If you select a KPI: the event will be fired each time the selected KPI is fired.
   • If you select Manual (Action): you must give it an Action name and then you can call that action anywhere on your experience where you can run an action to fire the event.
3. Give the event a name which will be used to identify it on Google Tag Manager’s interface
4. (Optional) then add any number of data properties ( variable name – value ).

Remember to create a trigger, variable and tag to fire that trigger with the variable linked in on GTM.

Creating GTM Tags for Google Analytics

1. On Google Tag Manager, under Triggers, create a trigger (Custom Event) for each event name provided above
2. Then under Variables, create a User-Defined Variable for each variable name provided above
3. Use those events and variables to create one or more Google Analytics tags

Tip: You can use any number of events on the same tag to combine everything.

Other relevant links

Setup Tracking With External Analytics

Cross-Domain Tracking With Google Analytics

Measure Success With KPIs