Before you go, check out these stories!

Hackernoon logoHow to Track Form Completions with Google Tag Manager by@thakursaurabh88

How to Track Form Completions with Google Tag Manager

Author profile picture

@thakursaurabh88Saurabh Thakur

Digital Nomad who loves to read & write startup stories, and tech news.

Setting up a website is relatively easy in 2020. Gone are the days when you had to code the whole thing on notepad and then connect to your host with some additional FTP software.

Dreamweaver came along in 1997 and mixed things up quite a bit. With the increased number of templates available online too, it became substantially easier to create a professionally looking website. It still wasn't easy to go from knowing nothing about design or code, to creating a website however.

That all changes with the ascendance of Content Management Systems (CMS) such as Wordpress and Joomla. Registering a domain name and purchasing hosting can all be done within a few minutes these days too.

Getting Traffic is the Foundation of any Successful Website or Blog

This is all a double-edged sword for bloggers and webmasters. Thanks to the abundance of websites (1.5 billion in existence apparently - not sure who's counted them all though), competition for traffic is higher than ever.

In addition, Google is pushing their ads more than ever, giving them more real estate on the results pages. They are also generating lots of 'zero click' searches by pulling information from web-pages to the Google-results-pages themselves - users no longer have to click through to a website.

Getting traffic to your website can still be done with some hard work and creativity however. Create great content and promote it - the links should then (hopefully) come and your rankings should then improve. Research and statistics typically work well for gaining links, as people like to reference useful information. Make sure your website loads quickly, is mobile friendly and makes proper use of headers and meta information.

Form Submission Tracking in Google Analytics

Assuming that all went well for you; if you want to make a profit or track how well your paid advertising or social campaigns are performing, you will need to set up event tracking in Google Analytics and Google Tag Manager.

For many small business owners, lead generation is the main aim of their website. Bloggers too, will want people to contact them for advertising rates etc.

To track this, we can see how many forms are submitted and use Analytics data to see where 'form-completers' are coming from e.g. social, google organic etc.

Before we begin the Google Analytics way of tracking form completions, please be aware that you will need a form 'thank-you' page in order for this to work. Well - not specifically a thank-you page, but the URL will need to change once the form is submitted.

You can test this by completing a form submission yourself, then seeing if you are redirected to a different URL (other than the homepage). This will typically be a thank-you page or a URL with "contact-form" within it. Either way, make a note of the URL.

Event Tracking in Google Analytics, is reasonably straight forward.

You can track lots of things in Google Analytics, including:

- Live Chat Engagements (specific tutorial here) - Button Clicks - Form Submissions - Add to Cart Clicks - Purchases - Phone Calls (specific tutorial here)

This can be done in Google Analytics - but it's easier to use Google Tag Manager.

Either way, you'll need to setup Analytics on your blog, using your UA-ID

Open Google Chrome, go to Google Analytics, sign up and then make a note of your UA-ID. If you missed it for any reason, you can grab this by logging into Analytics, clicking the gear icon near the bottom left to go to Admin, then Property, then Tracking Info:

Assuming that you are using Wordpress for your blog platform (not a free version however, you either need to upgrade the free version or use a different host like bluehost, hostgator or GoDaddy to be able to use Analytics and Plugins) - you can use a free plugin such as Monster Insights to enter you UA-ID and get Analytics up and running:

To set up an event in Analytics, navigate back to the Admin section and click "Goals"

Select the red "New Goal" button

Next you will choose a "Custom" goal - "Destination", then "Begins With". Here you can enter the start of the URL that you made a note of earlier - the one you were taken to after submitting a form:

Then click save!

It can take a few hours to work, but you should then test this by submitting a form and looking at the Real Time report on the Analytics homepage.

Using Google Tag Manager to Track Events

To use this method, the form must have a Form-ID associated with it.

First things first, go to Google Tag Manager and sign up with the same account that you signed up to Analytics with.

Please note - It's important to use Tag Manager with Google Chrome.

Once signed in, setup a "Container" and choose "Google Analytics" as the product. Here you will have to enter your UA-ID again.

Now you will need to add the code that you are given to your Wordpress website to install Tag Manager. For this you can use the "Insert Headers and Footers" plugin and copy and paste the code into the Headers.

Once everything is set up - click to Publish your container.

Back in the main dashboard, click Variables in the side-menu:

Check that "Form ID" is ticked in the Built In Variables section:

Now we need to make a trigger for the event.

Go back to the homepage of the dashboard and then click “Triggers” in the side menu and then “New

Give the trigger a relevant name such as "Form Submission".

Next click on the bit that looks a bit like a grey circle, to configure it.

Then click "Form Submission" in the list that appears on the right.

Next we need a Tag for the event.

Back on the homepage - click “Tags” in the side menu. Then name the tag, click the grey circle to configure it and select “Google Analytics

Change “Track Type” to “Event” in the drop-down menu on the left.

For the "Event Tracking Parameters", give the Category a Name – e.g. “Form Submission" or "Lead”, then an Action e.g. “Form Submitted” and then importantly – give it a label.

You need to add the Form ID as the label, via a variable. To add a variable to the Label parameter, click the icon to the right which looks like a Lego brick and then select “Form ID” from the list of potential labels.

Finally, add a trigger by clicking the grey circle near the bottom and then choose the trigger that you setup earlier – “Form Submitted”.

Submit the changes via the “Submit” button.

And you're all done!

Test that it is all working by opening Google Analytics in one tab and your website in the other.

Go to the real time report in Analytics and submit a form - you should see that an event is triggered in the report...

And that’s it!

As well as form completions, you’ll almost definitely want to track clicks. More on that in a future tutorial…


Join Hacker Noon

Create your free account to unlock your custom reading experience.