Main Image

Google Tag Manager 101 Part 5 - Forms

The article sets out an easy way to track form submissions when a submitted form does not generate an extra page view. In the olden days, form submissions were fairly easy to track in Google Analytics. A successful submission would take the user to a "Success" page and there was no need for any smart tracking. These days, most forms stay in page when a successful submission takes place so there is no page view recorded in GA - and no way to track if the form is being used at all.

With Google Tag Manager, it is easy to generate an event or a page view whenever a user submits the form. What is not so easy is only sending the event when the submission is successful so that won't be covered that in this article as we wish to keep the series "Javascript free". If you do want to delve deeper, this website should be your first port of call - Simo Ahava's Blog

The Google Tag Manager 101 Series

  1. The Basics - setting up Google Tag Manager

  2. How to create a trigger and a tag

  3. Tracking links

  4. Social media tags

  5. Forms

  6. Timers and the real bounce rate

  7. The Datalayer

  8. CSS Selector

  9. YouTube Video Tracking

  10. Scroll Tracking

  11. Trigger Groups

  12. Non-Interaction Events

Assuming you have worked through the previous articles in the series, let's dive directly into creating triggers and tags.

Building a Form Submit Tag

What we want to do is track whenever someone posts a comment onto this blog. (Feel free to post a comment to help me with the testing ....)

Trigger

We enable our trigger only for our Blog and News pages and we fire when the Form ID is called frmComment. To get the Form ID, inspect the element of the form as shown. (in Chrome, right-click on the form and Inspect Element)

Google Tag Manager Inspect Element

This trigger will fire whenever the Submit button is clicked on the Comment Form. Google Tag Manager Trigger

Tag - an event

For the tag, we can create an event called Blog Comment and send through the Page Path so we know which Blog article the user commented on. You can decide exactly what information you want to send through with the event.

Google Tag Manager Tag


You are able to create a goal from the event above - but if you want to create a goal funnel (for example when there are a series of steps leading up to the form submission) then you must create a virtual page view instead.

Tag - virtual page view

We set "page" by using the Page Path and we add on the word Comment so that it appears as a discrete page view - this page would appear in our All Pages report as

/blog/2015/july/20/google-tag-manager-101-part-4-social-media/Comment

Google Tag Manager Tag

It is as simple as that - no more than 10 minutes and you have configured the tracking of your form. As usual, the Preview mode of Google Tag Manager should be used to test that the tag is fired at the correct time (and not fired at the incorrect time).

Remember that to test without affecting your live Google Analytics data, you should filter your own IP address from your live GA account and have a separate unfiltered view of GA. You can use the Realtime view of your unfiltered traffic to see the events or page views being received.

The Future

Although this was to be Part 5 of 5, I did produce Part 6 of 6 - a way of recording the "real bounce rate" for your blog pages. The real bounce rate is a way of measuring engagement for users that have landed on an article, not clicked through to another page but have spent time on the article page.

I will also produce more articles whenever I come across a useful feature in Google Tag Manager. Thanks to everyone who followed the series and especially to those who commented. Please continue to send through any questions that you have.