How to track Search and Click events in Google Tag Manager

Introduction

A common scenario is that you may want to track Store Locator Search events as part of your Google Adwords or other Conversion and goal tracking process using Google Tag Manager. For example, whenever a visitor searches for a location inside your store locator you could record this as a goal inside Google Adwords.

Each time a Search is conducted inside your store locator, the following function is called by the locator if it exists:

storeLocatorSearchEventHandler(eventData)

A search event is recorded in each of the following scenarios:

• The 'My Location' button is pressed by the visitor.
• The visitor is automatically geolocated (if the Customer Geolocation setting is set to 'Automatically locate user' on your Settings page).
• The visitor searches for an address in the address search field
• The visitor searches for a location using the location search field (if this is enabled).

Getting your Goal Conversion Codes from Google Adwords

Before you get started, you'll need to get the conversion codes for the conversion action which you want to track. Here's the process:

1. In Adwords select Tools -> Conversions

2. Click on the Conversion Action you would like to link

3. Under Tag Setup scroll down select 'Use Google Tag Manager'

4. Your Conversion ID and Conversion Label are shown there (see example below):

Google Tag Manager Installation

1. First, create a new tag.

2. Choose 'Custom HTML' as the type.

3. Paste the following into the HTML field with the Conversion ID and Conversion Label values taken from your Google Adwords Conversion tracking console:

function storeLocatorSearchEventHandler(eventData) {
	gtag('event', 'Store Locator', {
		'event_category': 'Search',
		'event_label': 'Store Locator Search Event: ' + eventData.type,
		'send_to': 'AW-CONVERSION_ID/AW-CONVERSION_LABEL'
	});
}

4. You'll want to use a firing trigger of type 'Page View'.

5. Now publish the tag to the page on your website where your store locator is hosted (or to the entire site, either is fine). Search events in your locator should be tracked as Conversions.

Tracking Click Events

You can also track Click events via the following script:

function storeLocatorClickEventHandler(eventData) {
    if (eventData.element == "buttons") gtag('event', 'Store Locator', {
        'event_category': 'directions',
        'event_label': eventData.storeName,
        'send_to': 'AW-CONVERSION_ID/AW-CONVERSION_LABEL'
    });
    else if (eventData.type == "link") gtag('event', 'Store Locator', {
        'event_category': eventData.element,
        'event_label': eventData.url,
        'send_to': 'AW-CONVERSION_ID/AW-CONVERSION_LABEL'
    });
    else if (eventData.type == "storeName") gtag('event', 'Store Locator', {
        'event_category': eventData.type,
        'event_label': eventData.storeName,
        'send_to': 'AW-CONVERSION_ID/AW-CONVERSION_LABEL'
    });
    else gtag('event', 'Store Locator', {
        'event_category': eventData.type,
        'event_label': eventData.storeName,
        'send_to': 'AW-CONVERSION_ID/AW-CONVERSION_LABEL'
    });
}

Advanced Usage

Additional data about the search event is passed inside the eventData object and this can be used to enhance or provide further detail of the conversion type. Here are the attributes of the eventData object:

• address: The address that was searched (either the address entered into the input field or the address of the midpoint of the map if the 'My Location' button was used to geolocate the visitor)
• distance: The distance in kms to the closest location
• filters: Any filters that were applied
• map_lat: The latitude of the address
• map_lng: The longitude of the address
• nearest_storeid: The StoreID of the closest location
• nearest_storename: The name of the closest location
• referrer: The HTTP referrer if available (web page which linked to this page)
• type: The type of search - either "geolocate" where geolocation (the My Location) button was used or "address" where an address was searched for.
• uid: Your unique account user ID 
• url: The URL of the current page