Track website forms using GTM

How to track website forms using Google Tag Manager

Share This Post

Difficulty: Easy
Time to Learn: 20 Minutes
Time to do: 5 Minutes

A contact page is a standard on almost every website on the net. By having one on your website, it gives the opportunity for your website visitors to communicate with you. There’s usually an email address of the business, a phone number, possibly a fax number and hopefully a contact form.

There are a few business advantages of having a contact form, a call back request form or any kind of form on a website. The main benefit is that of usability. With the majority of internet users now using mobile, a conveniently or strategically placed contact form will enable them to easily get in touch with you.

So you have a contact form or a few on your website. Great news. Now… you are receiving messages from them? It’s always good to test this every now and again – it’s amazing how many I have filled in only to be greeted with an error code.

Benefits of tracking website forms

Tracking a website form means you, as a business owner, marketer or salesperson, will be presented with data about your website visitors such as:

  • Which traffic source it came from i.e organic, direct, referral, social, paid or other.
  • Whether there were more than 1 traffic sources involved in the whole customer journey to conversion.
  • Which website page they completed the contact form on.
  • The time and date the website form was completed.
  • If the website form isn’t working.
  • Which of your PPC or Organic keywords are driving the most valuable traffic to your website.
  • Which of your PPC keywords are just simply not working for you and should be reviewed.

A nice chunk of valuable data huh, bet you wished you’d set this up sooner! So, without further waffle here’s how you can track website contact forms using Google Tag Manager.

Similarly to tracking text, email or button clicks using events in Google Tag Manager, you will need top-level access to the following accounts:

  • Google Tag Manager
  • Google Analytics
  • Google Tag Assistant (this is not an account but a Chrome Plugin)

Add Google Tag Assistant to your Chrome browser here

How to track website contact forms using GTM

For this method of tracking to work you will need to ensure Google Analytics is being loaded with Google Tag Manager, i.e. GA tracking code is not on your website in raw code format.

You can tell whether it is or not by using our new trusted friend Google Tag Assistant (GTA). So head on over to your website and click on the GTA smiley icon. Click “Enable” and then refresh your website.

If you see a single Google Analytics result, you (or your developer) will need to remove this. You will then need to add the Tag Manager code in replacement of this and set up Google Analytics to load via GTM.

Before you start make sure you have Google Analytics set up on your Google Tag Manager.

Step 1 – How does your contact form work?

First off, we need to find out how your website contact form loads i.e. when someone completes the form does it redirect to another page or does it load on the same page?

Does it…

A. Load on the same page (the URL doesn’t change from pre to post form completion? – You will need to track the form using button click tracking.)

B. Redirect to another page (the URL changes) read on…

MAKE A NOTE OF THE URL THAT THE CONTACT FORM REDIRECTS TO. IT MAY LOOK SOMETHING LIKE: 

yourwebsite.com/form-completion_xyz&TtgGIU

Step 2 – Set up your form trigger

In the sidebar select the “Triggers”, and New, then give your trigger a name, I’ve called it “Form Tracking”. Next, you will need to configure your trigger. You can do this by selecting the following options after you have clicked on the “Trigger Configuration” text

  • Page View (from the side menu)
  • Some Page Views
  • Page URL
  • Contains
  • /form-completion

Your screen should then look something like this.

Looking good? Save and move on.

Step 3 – Set up your contact form tag

The last step in setting up your contact form tracking is set up a tag. This essentially tells GTM to “I want an event to be triggered when this action is made on my website and then to tell Google Analytics it has done.”

In the side area, click on the “Tags” and New. Then complete the following:

  • Give your tag a name, here I’ve called it “GA Event – Contact Form”
  • Tag type – select Google Analytics
  • Track Type: Event
  • Category “contact form”
  • Action “contact form completion”
  • Label: Path Path
  • GA Settings: Select the GA variable
  • Triggering: The form tracking Trigger you created a moment ago
  • Save

setting up gtm tag

Step 4 – Testing

The testing process is exactly the same as if you were testing a button or email click. To find out how to do this and test your contact form you can pick this up from Step 4 here.

More To Explore

announcement
Blog

Changes to Marketing in 2022

In 2022, the marketing world is set to change. This blog will outline what these changes are expected to be and how they will affect

  • Do you want more traffic?

    Affordable Website Design is a streamlined website and marketing agency that helps you to create a hard working shop window with on point messaging to get you more customers.
    Tracking Website Conversions

    About Affordable Website Design Digital

    We’re Affordable Website Design Digital , an ambitious digital marketing agency based in Bristol. We specialise in PPC, Website design and SEO. We offer a connected, multi-channel marketing service tailored to every client we work with. We’re all about achieving growth for our clients. Our vision is to see all of our clients thrive. We strive to make them look like the best option, no matter what they do.

    Do you want more traffic?

    Affordable Website Design is a streamlined website and marketing agency that helps you to create a hard working shop window with on point messaging to get you more customers.