Concepts / Getting insights and analytics / Google Tag Manager
Sep. 27, 2019

Google Tag Manager

Sending events with Google Tag Manager

1. Setup Insights with Google Tag Manager

  • Download our official template and import it via Google Tag Manager Dashboard: Templates > New > import.

  • In User-Defined Variables, create the following variables: userToken, index, queryID, objectIDs, and positions.
    • Click New in the Variables panel
    • Name the variable (e.g. “ItemClicked”, “UserToken”, etc.)
    • Set the variable type:
      • Custom JavaScript if coming from data attributes (e.g. objectIDs, positions, queryID, etc.)
      • Data Layer Variable if coming from a Data Layer (e.g. userToken)
  • Setup your tags:
    • Click New in the Tags panel
    • Select the tag type “Algolia Search Insights”
    • Choose the event type and provide the “Search Insights” options
    • Select the trigger for this event

2. Expose the userToken to Google Tag Manager

1
2
3
4
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  userToken: '42',
});

3. Expose Insights event data to Google Tag Manager

1
2
3
4
5
6
7
8
9
10
11
12
13
14
instantsearch.widgets.hits({
  container: '#hits',
  templates: {
    item: `
      <article
       data-insights-object-id="{{objectID}}"
       data-insights-position="{{__position}}"
       data-insights-query-id="{{__queryID}}"
      >
        <!-- ... -->
      </article>
    `,
  },
}); 

__queryID and __position are available in hits and infiniteHits since InstantSearch.js 3.4.0.

Did you find this page helpful?