Iterate Event Listener
How to track Engagements with Iterate survey form with google tag manager
This guide will walk you through the steps of setting up an Iterate event listener within Google Tag Manager (GTM) to track user interactions with the Iterate survey widget on your website. By capturing these interactions, you can send the data to analytics platforms like Google Analytics (GA4), Piwik Pro, or others for deeper insights into user engagement.
Step 1: Add the Iterate Event Listener Script to GTM
To begin, copy the provided Iterate event listener script and add it as a Custom HTML Tag in Google Tag Manager (GTM). Set the tag to fire on the DOM Ready trigger, which ensures that the Iterate widget has loaded before the script starts listening for interactions.
💡 Pro Tip: Always trigger your tag on DOM Ready to prevent any potential issues with the widget loading too late.
The event listener listens for three main user actions within the Iterate widget:
- Survey Shown
- Survey Minimized or Closed
- Survey Response
Whenever one of these events is triggered, it pushes the relevant details to the dataLayer with the event name Iterate_interactions.
Step 2: Create a Custom Event Trigger in GTM
Once the script is added, create a Custom Event Trigger in GTM to listen for the Iterate_interactions event. This will ensure that the correct tags are fired when one of the events occurs.
- Go to Triggers in GTM.
- Create a new Custom Event Trigger.
- Set the event name to Iterate_interactions.
This trigger will activate whenever any of the interactions (survey shown, survey closed, or survey response) occur, allowing you to fire relevant tags.
Step 3: Define DataLayer Variables in GTM
To extract the data from the Iterate_interactions event, you will need to define a set of dataLayer variables. These variables will capture detailed information about the interactions that can be sent to your analytics platform.
Here are the primary variables to define:
- iterate_action_type: Describes the type of interaction (e.g., shown survey, minimize survey, respond to survey).
- question: The specific question that the user responded to (only applicable for the onResponse event).
- response: The answer provided by the user for the question (only applicable for the onResponse event).
- additionalData: You need to inspect this datalayer object to see the data point you might need, as these are data that may be passed along with the response (e.g., metadata about the question or response type).
These variables will help you track the survey interactions in greater detail and send that data to your analytics platforms.
Step 4: Connecting Your Trigger to Marketing Tags and Pixels
After configuring your triggers and variables, the next step is to set up the appropriate marketing tags to send interaction data to platforms like Google Analytics (GA4) or Piwik Pro.
For instance, to track Iterate interactions in Google Analytics 4 (GA4):
- Create a GA4 Event Tag.
- Set the Event Name to iterate_hq_interaction.
- Configure the Event Parameters to include:
- iterate_action_type (e.g., shown survey, minimize survey, respond to survey)
- question (for onResponse events)
- response (for onResponse events)
This ensures that every time a user interacts with the Iterate survey widget, the data is sent to your analytics platform for tracking and reporting.
The Iterate event listener script is agnostic to any tag management solution, meaning it can be used with platforms other than GTM. The process remains consistent across different TMS systems.
<script>
(function() {
// Make sure dataLayer exists
window.dataLayer = window.dataLayer || [];
// Define IterateHQ event handlers
if (typeof Iterate === "function") {
// onLoad event – survey shown
Iterate('onLoad', function() {
window.dataLayer.push({
event: 'iterateHQ_interactions',
iterate_action_type: 'shown survey'
});
});
// onClose event – survey minimized or closed
Iterate('onClose', function() {
window.dataLayer.push({
event: 'iterateHQ_interactions',
iterate_action_type: 'minimize survey'
});
});
// onResponse event – user responds to a question
Iterate('onResponse', function(question, response, additionalData) {
window.dataLayer.push({
event: 'iterateHQ_interactions',
iterate_action_type: 'respond to survey',
question: question,
response: response,
additionalData: additionalData
});
});
}
})();
</script>
Video of how to use the listener
Related Event Listener
Survicate
Forminator
SurveyCompo
download the google tag manager recipe for tracking Engagements with Iterate survey form
