Tracking Form Submissions Using the Element Visibility Trigger

The importance of tracking form submissions on a website can’t be overstated — it’s one of the main ways users can leave a request. I’ve previously written articles on how to track form submissions in Google Tag Manager using a basic trigger or through validation inside the tag manager. Today, I want to show you another method — it’s suitable for forms where a thank-you popup appears after a successful submission. For example, something like this:

This method is based on using the Element Visibility trigger type. So, on the one hand, this article is about form tracking, and on the other — about working with the Element Visibility trigger.

• Basics of the Element Visibility trigger
• Configuring the trigger for a thank-you popup
• Sending data to Google Analytics 4
• Instead of conclusion

Basics of the Element Visibility Trigger

The Element Visibility trigger type helps detect when an element enters the visible area of the screen. Let’s look at its parameters in more detail:

1. Selection Method – This parameter defines the method used to select the element. You can select it either by ID or by CSS selector.

2. Element ID / Element Selector – Based on the Selection Method value, specify either the element's ID or its CSS selector.

3. When to fire this trigger – This defines how many times the trigger can fire on a page

• Once per page – No matter how many times the element becomes visible, the trigger will fire only once per page. If there are multiple matching elements, the trigger fires only for the first one.
• Once per element – The trigger will fire once per matching element on the page. If a CSS selector is used and there are multiple elements, it will fire once for each. If an ID is used, it fires only for the first match.
• Every time an element appears on screen – The trigger fires each time the element enters the viewport.

4. Minimum Percent Visible – Defines the minimum visible percentage of the element required for the trigger to fire. Acceptable values range from 1 to 100. This is useful, for instance, when you want the user to fully see a banner.

5. Set minimum on-screen duration – Defines the minimum time (in milliseconds) the element must remain visible for the trigger to fire.

6. Observe DOM changes – Enable this option if the element appears later due to DOM changes. For example, a popup after a form submission.

7. This trigger fires on – Choose Some Visibility Elements to specify additional conditions for firing. For example, only on the homepage, as shown in the screenshot.

Configuring the Trigger for a Thank-You Popup

Theory is good, but let’s move to practice. In my case, I’ll use a CSS selector because the element doesn’t have an ID. To get it, we first need to fill in the form and see the popup. Then right-click the thank-you element and choose Inspect:

Locate the correct element in the code. Be careful — quite often, the form popup and the thank-you window share the same selector. In that case, the trigger may fire upon form display, which would lead to incorrect data. It’s best to use an element that appears only after a successful form submission — like the thank-you text.

Go to Google Tag Manager and create a new Element Visibility trigger with the following settings:

• Selection Method – Choose CSS Selector
• Element Selector – Paste the selector you copied earlier
• When to fire this trigger – Choose Once per page, because you don’t want the event to fire again if the form is submitted multiple times
• Minimum Percent Visible – Since we don’t care how much of the thank-you text is visible, set a low number, like 10
• Set minimum on-screen duration – This parameter doesn’t matter here, you can leave it off
• Observe DOM changes – Make sure this is enabled, because the popup appears due to DOM changes
• This trigger fires on – Choose Some Visibility Elements and specify the pages where the form is located (e.g. the homepage), or choose all elements if you want to track submissions site-wide

Sending Data to Google Analytics 4

To send the data to Google Analytics 4, use a standard event-type tag with the following configuration:

Don’t forget to set the Event Name field to the name that matches your setup.

Instead of conclusion

The Element Visibility trigger isn’t just useful for tracking popups — you can use it for other purposes too. For example, measuring the performance of promo banners. Share your ideas in the comments about other ways to use this trigger, and feel free to ask questions if you have any.

If you enjoyed this content, subscribe to my LinkedIn page.

I also run a LinkedIn newsletter with fresh analytics updates every two weeks — here’s the link to join.