Google Tag Manager

What is the Google Tag Manager integration?

The Cludo integration with Google Tag Manager allows for sending events and data from Cludo to various business and marketing platforms. Each time a search is made or a search result is clicked, Cludo passes an event into the Google Tag Manager data layer. These events contain information about the search or clicks, which can be sent to other software platforms, e.g. analytics or advertising systems.

What Data can be used?

Each search or click event contains contextual data that you can access.

In search events:

• engineId: The ID of the engine that was used for the search
• query: The query (or search term) that was searched
• resultCount: The number of search results returned
• browserLanguage: A string representing the preferred language of the user, usually the language of the browser UI
• deviceType: The device type used for the search – ‘desktop’, ‘mobile’, or ‘tablet’
• inputType: The input method used for the search – ‘typed’ for most typical searches or ‘voice’ for voice searches
• selectedFacets: An array of any facets (or filters) that were set during the search
• userTraits: An array of traits that can used to group the search user into Cludo audiences
• pageNumber: Which page of results was requested
• responseTime: How long the search request took to complete (in milliseconds)
• userAgent: The user’s browser user-agent string
• timeStamp: The time the search was made (in Unix time)
• eventType: The relative order of the search – this has two possible values:
  • ‘initialSearch‘: The search that first brought the user to the search results page
  • ‘secondarySearch‘: Any follow-up searches the user had to make. This indicates that the user probably didn’t find what they needed from the first search.
• eventTrigger: The UI element or event that set off the search – this has five possible values:
  • ‘searchBar‘: Triggered by a normal typed or voice search from the search bar
  • ‘facetsClick‘: Triggered by a facet (or filter) click
  • ‘paginationNext‘: Loading the next page of results by clicking the “next” pagination button (or by scrolling to the bottom of results to load more for infinite scroll search).
  • ‘paginationPrevious‘: Loading the previous page of results by clicking the “next” pagination button.
  • ‘backButtonAfterResultClick‘: Triggered when a user clicks into a search result, then clicks the back button to go back to the search results page. This indicates that the user probably didn’t find what they needed on the clicked result.

In click events:

• engineId: The ID of the engine that was used for the search
• query: The query (or search term) that was searched
• browserLanguage: A string representing the preferred language of the user, usually the language of the browser UI
• deviceType: The device type used for the search – ‘desktop’, ‘mobile’, or ‘tablet’
• inputType: The input method used for the search – ‘typed’ for most typical searches or ‘voice’ for voice searches
• selectedFacets: An array of any facets (or filters) that were set during the search
• userTraits: An array of traits that can used to group the search user into Cludo audiences
• pageNumber: Which page of results was requested
• responseTime: How long the search request took to complete (in milliseconds)
• userAgent: The user’s browser user-agent string
• timeStamp: The time the search was made (in Unix time)
• clickedUrl: The page URL of the clicked result
• clickedIndex: The result number in the set of results (for example, the second result in the list would have index 2)

How are events structured?

Events consist of two main components:

• The event name – either cludo_search_event for searches or cludo_click_event for clicks
• The contextual event data described above – found under the cludoEventData parameter

Here is an example of a search event in JSON code:

{
	‘event’: ‘cludo_search_event’,
	‘cludoEventData’: {
	        ‘engineId’: '90n3j5',
	        ‘query’: 'search design trends',
	        ‘eventType’: 'secondarySearch',
	        ‘eventTrigger’: 'facetsClick',
	        ‘resultCount’: 13,
	        ‘browserLangauge’: 'en-US', 
	        ‘deviceType’: 'mobile',
		‘inputType’: 'typed',
		‘selectedFacets’:  [{name: 'Category', value: 'Blog'}],
		‘userTraits’: ['logged-in-user'],
		‘pageNumber’: 1,
	        ‘responseTime’: 124,
	        ‘userAgent’: 'Mozilla/5.0 (platform; rv:geckoversion) Gecko/geckotrail Firefox/firefoxversion',
	        ‘timeStamp’: 1674250161
        }
}

Mapping event data to “variables”

By default, Google Tag Manager will not be able to use all of the data in events that pass through the data layer. To support this, a specific variable that matches the data must be made.

Using events to create “triggers”

Triggers can be set up so that certain Google Tag Manager tags will do a specific task when specific conditions are met. Cludo events can be used to define these specific conditions.

How to send search data to Google Tag Manager

1. In the navigation, select Configuration › Data settings
2. Enable the Send data to Google Tag Manager toggle
3. Click the Save button

Using events within Google Tag Manager

To create a variable:

1. Log into your Google Tag Manager container
2. In the left menu, select the Variables option
3. Under User-Defined Variables, click the New button
4. Type a descriptive name for the variable in the Untitled Variable field
5. Under Variable Configuration, Click Choose a Variable type to begin setup….
   • Under Page Variables, select Data Layer Variable
   • Enter the variable name in the Data Layer Variable Name field
     • This is the name of the event parameter that you want to access
     • In our example below, this would be cludoEventData.query. Remember that all Cludo event parameters are stored in the cludoEventData object.
   • Ensure the Data Layer Versions drop down is set to Version 2
   • Click the Save button
6. To publish your changes, click on Submit in the top right

Using events to create “triggers”

Triggers can be set up so that certain Google Tag Manager tags will do a specific task when specific conditions are met. Cludo events can be used to define these specific conditions. For example, I could set up a trigger that tells my Google Analytics tag to send a product_search_result_clicked event when a Cludo click event occurs and the clicked URL contains ‘/products’ (remember, to access the clickedUrl, you first need to map it to a variable).

To create a trigger:

1. Log into your Google Tag Manager container
2. In the left menu, select the Triggers option
3. Under Triggers, click the New button
   • Type a descriptive name for the trigger in the Untitled Trigger field
   • Under Trigger Configuration, Click Choose a Trigger type to begin setup….
   • Under Other, select Custom Event
   • Enter “cludo_search_event” or “cludo_click_event” in the Event name field
   • Under This trigger fires on:
     • Leave All Custom Events set if you want the trigger to fire every time this event occurs
     • Or, set this to Some Custom Events to add more conditions that need to be met for the trigger to fire. In our example, we wanted to also add the condition that the clicked search result URL contains “/products”
   • Click the Save button
4. To publish your changes, click on Submit in the top right

That’s the hard part! Now that you’ve created variables and triggers using Cludo event data, you can use them in all kinds of ways with your GTM tags. Check out Google’s official Google Tag Manager documentation for more information.

How to send search data from Google Tag Manager to Google Analytics

The following steps requires Cludo search data to have been correctly setup in Google Tag Manager. Make sure to read the chapter How to send search data to Google Tag Manager first.

Set up the custom event

• Log into Google Tag Manager.
• In the left menu, select the Tags option.
• Under Tags, click the New button.
  • Type a new name for the tag in the Untitled Tag field.
  • Under Tag Configuration, Click Choose a Tag type to begin set-up….
  • Under Featured, select Google Analytics -> Google Analytics: GA4 Event.
  • Enter the Google Analytics ID or a Google Analytics tag in the Configuration Tag field. (G-1234)
  • Enter “view_search_results” in the Event name field.
  • Add one Event Parameter for each custom definition in Google Analytics:
    • Under Event Parameters, click the Add parameter button.
    • Enter the parameter name for Google Analytics in the Event Parameter field.
    • Select the matching variable in the Value field.
  • Under Triggering, Click Choose a trigger type to begin setup….
    • Select the custom event which was created in the last section.
    • Click on Submit Button.
  • Click the Save button.

Once these steps are complete, Google Tag Manager will properly pass search events from Cludo to the Google Analytics account. It is possible to test the configuration by reviewing search events in Google Tag Manager DebugView.

How to set up a custom definition

• Log into Google Analytics.
• In the left side panel, click the Admin menu.
• In the Data Display list, select the Custom definitions option.
• Create as many custom definitions as needed:
  • Click the Create custom dimensions button.
  • Enter a descriptive name in the Dimension name field.
  • Ensure the Scope drop down is set to “Event”.
  • Optional: Enter a description in the Description field.
  • Enter the Cludo parameter in the Event Parameter field.
  • Click the Save button.

View search data in Google Analytics

• Log into Google Analytics.
• In the left menu, select the Reports option.
• Under Life Cycle, click Engagment › Events.
• In the event table, click the view_seach_results event.

A full report on the search event will appear.

Best Practice for using search data in Google Tag Manager

The Google Tag Manager integration allows for a wide spectrum of connections to different 3rd party system. Before setting up the integration, it is important to plan ahead and map out what the search data will actually be used for and in which systems.

To give inspiration, here is a list of different possible use cases which can all be configured to use from Google Tag Manager.

Analytics

Analytics is one of the most obvious cases for the search data. Although dashboard and advanced analytics are provided for the search data inside of MyCludo, passing the search data on to a 3rd party, allows for matching the search data with other sources. Systems like Google Analytics, Amplitude, Mixpanel and Tealium can benefit from receiving the search data.

Once the data is in a common analytics system like Google Analytics, it can be used as a source for further BI systems like Microsoft PowerBI or Looker.

Example

Sending search data to Google Analytics, allows for comparing the search activity with the general website activity. Using the tracking provided by Google, it allows for measurements on how many searches resulted in further actions like booking a meeting og signing up for a newsletter. This allows for a more precise metric to look at, compared to what can be shown with only the search data.

See our how to guide for Amplitude.

Advertising

Being able to provide more targeted advertising based on visitor activity, can not only save money in the ads, but also improve the click rate of the ads. Ideally the search data can be linked up with a specific visitor, which makes Google Ads a good candidate. The Google Tag Manager tracking can synchronize with Google Ads to customize ads based on specific search behaviour by the visitor, without ever providing any sensitive or identifying data.

See our how to guide for Google Ads.

Personalization

Personalization allows for a more personal and custom experience in an interface, using prior knowledge of the visitor. Using certain Google Tag Manager connectors, it is possible to connect to platforms like Userpilot to show custom announcement, tips or tutorials based on the visitors search activity.

Example

When a visitor searches for “password reset” in the user guide, the data is sent to Userpilot. At their next login into the platform, running Userpilot, a tutorial will appear to guide them through how to open their account settings and resetting their password.

Messaging

Using the visitor search data can be a great tool for initializing a chat, with a lot more prior knowledge. System liks Intercom allows for plenty of custom configuration from Google Tag Manager, which can affect when the chat box appears and event pass custom events to inform Intercom what recent search activity has happened.

Example

When clicking a result and quickly returning to the result list, prompt an Intercom message chat to appear for the visitor.

Further data handling

There are many more options for parsing data on to 3rd party system, which in turn can deliver the search data to any required data source. Platforms like Segment specialized in connecting different data platforms, and can be used to receive the search data from Google Tag Manager and pass it on.

How does Google Tag Manager work with Google Analytics?

While it is possible to send search data directly from Cludo to Google Analytics, the Google Tag Manager integration allows for even more complex data to be sent to Google Analytics. These custom events include detailed search and click events, which can be added with more custom data or triggers through Google Tag Manager.

It is possible to use both the Google Analytics and Google Tag Manager integration at the same time, with the direct integration providing basic search events, and Google Tag Manager providing more custom data.