All Collections
Website Overlay Channel
Implementing Website Overlay Survey in Google Tag Manager
Implementing Website Overlay Survey in Google Tag Manager

Easily implement your Website Overlay survey using Google Tag Manager.

Written by Lisa Rentrop
Updated over a week ago

Google Tag Manager (GTM) is one of the easiest ways to implement and organise your website scripts by allowing you to implement one code and manage all scripts from a single dashboard - setting triggers and their order to launch scripts when needed.

By doing so, your website loads faster and you are not reliant on developer resources.

The result? You can integrate zenloop's Website Overlay in just a few minutes and target it precisely.


Integrating the Survey:

1. Copy the page URL of where the survey should be displayed and copy to your notes

2. Create a Website Overlay survey and copy the code:

3. In GTM, select your container:

4. Select Triggers < New:

5. Select 'Choose a trigger type to begin setup...' and select a trigger type (for this example we will use "DOM Ready" to fire the tag after the whole page has loaded) :

6. To trigger the survey on specific pages, or when a page URL contains a specific value, select Some DOM Ready Events < Page URL and enter the necessary conditions.

For this example, we only want to trigger the zenloop survey on the page that has "gtm-test" in the URL:

7. Save

8. Navigate to Tags < New to create a new tag

9. Select 'Choose a tag type to begin setup...' to choose a tag type. Select Custom HTML:

10. In the HTML box, insert the zenloop code copied in Step 1:

11. In Triggering, select 'Choose a trigger to make this tag fire' and select the trigger you created in Step 6:

The 'Tag Configuration' should look like this:

12. Save!

Previewing the Survey

1. Select Preview:

You will be redirected to a page where you can insert the page URL

2. Enter the URL and click Connect. You will be redirected to the page

3. If GTM is correctly installed on your page, you should see both the survey and a successful connection message. For example:

Adding Recipient Script (for Recipient & Properties)

If there are any variables on the page that can be used as an identity or properties, you can also include them in the recipient script. To find out more, click here.

Watch-Out: When using a Recipient Script, it’s important to fire it first before the main script with the survey.

To implement the Recipient Script;

1. Follow Steps 8 & 9 from Integrating the Survey

2. Follow Step 10 from Integrating the Survey but insert the script as described here ensuring you have the correct placeholders in place

3. Select Advanced Settings < Tag Sequencing < Fire a tag after Recipient fires and select the Tag created in Integrating the Survey:

The Recipient's Data Script is fired first to ensure all data is collected correctly

4. Finally, select 'Don't fire zenloop Checkout Survey if zenloop Recipients fails or is paused' to ensure no anonymous responses will be collected

Did this answer your question?