No Thank You Page? No Problem
Google Tag Manager Tip on How to Fire Conversion Tags on Form Fill Submission Without a Thank You Page
Why Doesn’t Everyone Just Have Thank You Pages?
What a great question. As a digital marketer, we know life would be easier if everyone directed users to a thank you page after their form submission. We’re no web developer coding magician but we can handle thank you page tracking. It’s the easiest conversion tracking to setup; “Fire this Tag IF url= /thank-you/” or some logic similar to that.
The problem is that the world has not yet decided to spin around our digital marketers’ universe quite yet (we’re working on that). There’s many reasons that a website owner or developer may decide a thank you page is not in the users’ best interest, and forgo it for some clever “your submission has been received” message. Hey, one less click for the user right?
Well that makes our tracking that much more difficult. How are we suppose to conditionally fire a conversion tag if the url doesn’t change, or even reload!? As an analytical nerd, this problem frustrated me and I’d always found one off solutions leveraging some confusing code I didn’t understand to get my tags to fire. That is, until I found out how easy this particular tag firing logic can be to setup in Google Tag Manager!
Below is a quick summary on how to fire your conversion tags on form fill submission for those forms that don’t take users to thank you page. This requires the form to display some form of thank you message which should cover 90% of cases, but if you’re unique, here’s a great tutorial from Julius Fedorovicius to troubleshoot your issue.
Fire a Conversion Tag on Form Fill Success Message
Step 1: Leverage Google Tag Manager
You’ll need Google Tag Manager to fire this tag. You should be using it anyways as a digital marketer if you’re not already leveraging a tag manager. Learn more about it here.
Step 2: Install the SelectorGadget Chrome extension
This is a great extension that will help us determine what code on the site represents our thank you message. Download the extension here, or if you’re not a chrome user, go here.
Step 3: Determine the CSS Selector logic that will recognize your form fill success message
You’ll want to submit a test form to get your success message to fire. When this happens, activate the SelectorGadget extension. Select the success message, and copy-paste that code somewhere for future reference. Make sure you’re selecting just the message, and not bigger boxes around the message or form
Step 4: Set up your Trigger in Google Tag Manager
When creating a new Trigger in Google Tag Manager, under the ‘User Engagement’ category, select ‘Element Visibility’. You’ll want the following criteria:
Selection Method: CSS Selector
Element Selector: [Your saved SelectorGadget text. example .elementor-message-success]
When to fire this trigger: Once per page
Observe DOM Changes: Checked
This Trigger Fires On: Check ‘All Visibility Events’ if the CSS Selector is unique, or select ‘Some Visibility Events’ and set to fire only when ‘Page URL’ contains [your form url]
Your Trigger is now set!
Step 5: Set up your tag to fire on this trigger and deploy!
Set your tag to fire on this newly created trigger. Best practice is to go into ‘Preview Mode’ in Google Tag Manager to test your logic. Also test other locations to make sure it doesn’t fire where it shouldn’t. Once you’re satisfied with the logic of your newly setup conversion tag, Submit and deploy your Tag Manager updates!
Hope this helps! I’ve used this simple setup many times now that I know how easy it is. Plus you’ll make all your other digital marketer friends jealous with your new found wizardry and you’ll even find new ways to apply this ‘Element Visibility’ tactic to other fun analytical tracking solutions. Happy marketing.
