Join the Tagmate Family to get latest updates and blog recommendations every week.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Blog
GTM
How to track website form submissions with GA4 and GTM.
GTM
How to track website form submissions with GA4 and GTM.
By
4 min read
June 30, 2022
Out of the total websites in the world, more than 40% are built using WordPress. That’s a huge number for any CMS platform and hence, there is a great chance that your website is built using WordPress. Also, you probably use the WordPress Contact Form 7 plugin for your website's contact us form.
So tracking of WordPress contact form 7 is extremely important.
We will show two ways to track WordPress contact form 7
Traditional Google tag manager way that would take a lot of time.
Limiting the number of form fields to three can reduce form abandonment rates.
By tracking the form data and analyzing it to arrive at groundbreaking insights.
Interesting! Right?
But tracking a form is an arduous task!
Don’t panic. It’s not as taxing as it seems.
We’ll take you through 3 ways to track forms, from the most difficult one to the least.
Fasten your seatbelts. And here we go…
Ways to Track Forms
Using Google Analytics (GA)
Using Google Tag Manager (GTM)
Through Tagmate App
Let’s see how to track a form with GA.
1.) Track Forms with Google Analytics (GA)
💡 GA will not track field data but just report conversions.
Follow the steps below :
Step 1: Sign in to your GA account.
Step 2: Click on the left navigation panel and click on ‘Admin’ at the bottom.
Step 3: Under the 'View’ header, click on ‘Goals’.
Step 4: Click on the red coloured button named ‘New Goals’.
Step 5: Under ‘Goal description’, enter :
Name of the goal
Select type as ‘destination’
Click on ‘Continue’
Step 6: Enter the URL of your thank you page and click on ‘Save’.
Done!
Now, you can see a goal created in GA, as one shown below:
For viewing the data, Click on the left panel.
Under the ‘Reports’ header, click on Real Time >Conversions > Goals > Goal URLs
To track a form using GA, you may need some basic knowledge of JavaScript (gtag.js). If you don’t have coding expertise, tracking forms through GA is difficult.
Also, as mentioned earlier, GA cannot track field data.
To track field data and analyze form fields, you need to install Google Tag Manager (GTM).
GTM acts as a middleman between the source code and GA. It enables you to add, delete and modify GA tags without disturbing the source code. So, you don't need to be a coding-master to work with GTM.
But working on GTM could feel taxing if you are not adept at it.
Read on to learn how to track forms using GTM.
2.) Track Forms with Google Tag Manager (GTM)
With GTM, you can track different types of forms :
Default form using form submit event
WordPress Contact form 7
Thank You page on form submission
Element visibility on form submission
Form using data layer
Here, we will go through the steps to create ‘Default form using form submit event’.
Follow the steps below :
Step 1: Sign in to your GTM account.
(If you don’t have a GTM account, create one from HERE)
Step 2: Open ‘Default Workspace’.
Step 3: On the left panel, click on ‘Trigger’ and then ‘New’.
Step 4: On the top-left corner, enter the name of the form (here we have named it ‘Form-contact us’). Click on the white space which is at the center of the screen.
Step 5: On the right panel, click ‘Form submission’.
Step 6: On the top-right corner, click on ‘Save’.
Step 7: On the left navigation panel, click on ‘Variables’. Then click on ‘Configure’ at the top-right corner. Check all the forms as shown below.
Step 8: Click on the ‘Preview’ button at the top-right corner to start the preview mode.
Important Tip: Before starting the Preview mode, insert the GTM container code in your website’s HTML file after the <Head> element. Watch how to do this.
Step 9: Enter your website URL and click on ‘Connect’.
Step 10: Click on ‘Continue’ in the same window.
Step 11: Go to your website (which will be in test mode) and submit the form with dummy data.
Note: A box named ‘Tag Assistant’ will appear when you are in test mode.
Step 12: Go to Tag Assistant. On the left navigation panel, click on ‘Form Submit’.
Look for ‘Form ID’. Copy the text in the ‘Value’ column.
Note: The text can be different. Here it is ‘test_form’.
Step 13: Go back to GTM and change the trigger.
Go back to the GTM Account. Open the Default Workspace.
Click on the form that you created in Step 4 (here we have named it ‘Form-contact us’).
Select ‘Some Forms’ under the header ‘This trigger fires on’.
Below you would see two dropdown lists. Select ‘Form ID’ from the first dropdown. Select ‘equals’ from the second dropdown. In the third column, paste the value which you copied in Step 13.
Click on the ‘Save’ button at the top-right corner.
Step 14: Create a new tag
On the left navigation panel, click on ‘Tags’. Now, click on ‘New’ as shown below.
Step 15: Select a "UA tag".
Step 16: Configure UA tag
Select ‘Event’ from the dropdown list which is under the header ‘Track Type’.
Enter ‘Form Submit’ in Category. Enter ‘Contact us’ in Action.
Select ‘Enable overriding settings in this tag’.
Paste your UA Property ID in the ‘Tracking ID’ field.
How to get a UA ID?
Step 17: Choose trigger
Select the trigger you created in Step 17.
Step 18: Click on the ‘Save’ button on the top-right corner.
Step 19: Test the tag again.
Repeat Steps 9 to 13.
Step 20: In Tag Assistant, check if the tag has been fired.
Step 21: Check it in Google Analytics.
Under the ‘Reports’ header, click on Real Time → Events.
You will see the form created as shown in the image below.
If you are finding tracking forms through GTM cumbersome, we have an easier solution for you.
This method doesn’t require you to have a coding background. The only pre-requisite is a basic understanding of GA, GTM and a Tagmate account.
But what is Tagmate?
Tagmate is a web-based tag management tool that accurately automates tag implementation, be it UA or GA4.
Tagmate can track your forms in just a few clicks, thus saving you valuable time and development costs.
Let’s see how you can track your form using Tagmate.
Track Forms with Tagmate
Let’s track the same form using Tagmate which is mentioned in above method 2
Step 2: Select a GTM Account or add new if you don’t have one.
Step 3: Push to GTM
On the left navigation panel, click on ‘Templates’.
Click on the ‘Form Submission’ header visible at the center of the screen.
You could see a template named ‘Form Tracking’.
Click on the ‘Push to GTM’ button.
Step 4: Select ‘Default Form Submit’ template by clicking on ‘Select Method’.
Step 5: Enter form name
Enter your Form Name. Click on the ‘Next’ button at the bottom-right corner.
Step 6: Provide Triggering Condition
Enter the triggering conditions and then click on the ‘Push to GTM’ button on the top-right corner.
Step 7: Check the tag in GTM
Step 8: Start the preview mode
Repeat Steps 9 to 13 of method number 2.
Step 9: Check it in GA4
And Done!
Within just a few clicks, you’ve created a tag to track forms.
Interesting! Isn’t it?
Well, that’s not the only superpower Tagmate has!
With Tagmate, you will soon be able to monitor your tags 24/7.
Anddd not only this, but you can even track custom events like Log In, Sign Up, Promo Banners, and many more. Tagmate comes with 40+ pre-built industry templates like the one you saw for Form Tracking.
Tagmate supports both GA4 and UA. There is a module in Tagmate, just for UA to GA4 tag-migration as well. This has helped enterprises like Angel One to migrate their tagging setup accurately and efficiently while saving time and costs by an order of magnitude.
On top of that, Tagmate can also track Google Ads and FB Ads Marketing Pixels. Now you can concentrate on strategizing marketing campaigns and let Tagmate handle the laborious task of tracking pixels.
So, if you would like to save development time and ensure accurate tag management, do give Tagmate a try.
Hope this guide will help you track forms on your website.
Frequently Asked Questions
Lorem ipsum dolor sit amet consectetur?
Lorem ipsum dolor sit amet consectetur. Viverra ut feugiat id ipsum morbi. A ipsum massa consequat ut urna vestibulum enim. Mauris id dignissim eu donec. Nibh urna eu nisl volutpat ut purus amet habitant fermentum.
Lorem ipsum dolor sit amet consectetur?
Lorem ipsum dolor sit amet consectetur. Sodales pellentesque enim sed dolor. Vel elementum ullamcorper adipiscing nec tristique. Egestas tellus amet praesent pulvinar quis.
Lorem ipsum dolor sit amet consectetur bibendum diam vel aliquet aliquam fringilla amet turpis varius srcu tincidunt potenti in ut amet ac aliquet donec volutpat ?
Lorem ipsum dolor sit amet consectetur. Aliquam diam magnis imperdiet pulvinar posuere. Pretium leo sed nunc morbi. In nibh risus purus ipsum amet. Leo sed laoreet orci faucibus. Ut lorem augue eget id venenatis odio tortor nec. Adipiscing bibendum tellus neque tortor.
Lorem ipsum dolor sit amet consectetur vel id viverra ultricies sed hendrerit et nulla?
Lorem ipsum dolor sit amet consectetur. Viverra ut feugiat id ipsum morbi. A ipsum massa consequat ut urna vestibulum enim. Mauris id dignissim eu donec. Nibh urna eu nisl volutpat ut purus amet habitant fermentum.
Lorem ipsum dolor sit amet consectetur bibendum diam vel aliquet?
Lorem ipsum dolor sit amet consectetur. Viverra ut feugiat id ipsum morbi. A ipsum massa consequat ut urna vestibulum enim. Mauris id dignissim eu donec. Nibh urna eu nisl volutpat ut purus amet habitant fermentum.
Subscribe to get our latest updates
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
eBook
Nunc lectus tempus dolor libero vulputate dui sed velit Augue enim malesuada
Get served hottest tracking posts from industry-experts every week.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
This is some text inside of a div block.
Heading
This is some text inside of a div block.
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
.png)
.svg)
.svg)
.svg)
.svg)
