Google Analytics Event Tracking Made Easy for Your Small Business

DISCLAIMER: This article assumes you already have Google Analytics set up for your website. It is also intended for basic uses of event tracking for the everyday person. If you need additional help with advanced Google Analytics tracking implementation, send us a message and we can work with you directly.

The purpose of this event tracking “how-to” is to simplify the process and make event tracking easy and painless for anyone. Yes, anyone… even if you think the word “code” has something to do with a super-secret encryption message used in the movie National Treasurer. Anyways, this guide will explain Google Analytics event tracking in good ole’ fashioned plain English.

The very basics, for the true beginners:

If you already have the basics down, skip to the next section.

For those starting from square one, here are some simple explanations of event tracking and why you should be using it. 

• What is an event for a website?
  • An event is a user interaction – interactions with elements of a website such as menus, buttons, downloads, search boxes, videos, or external links. 
• What is event tracking?
  • Event tracking allows you to monitor and track a specific user’s interaction/activity. 
• Why is event tracking important for my online success?
  • Chances are, you are already spending a ton of time, money, or both on your website. Event tracking is the only way to identify which elements are helping you to reach your online goals. It is important that you (or your online partner like Ironistic) measure this data to determine where, and how, improvements can be made to increase your return on investment.
• What types of events can I track with Google Analytics?
  • This could be a long list. I’ll cut to the chase and let you know how I personally use event tracking the most for our clients:
    • Email link clicks
    • Banner clicks
    • Ad clicks
    • Form submissions
    • External link clicks
    • Document downloads
    • Video progress (start, stop, pause, buffer) 
    • and the list goes on…

Okay, so let’s get to it.

I could write a few paragraphs explaining all the information in the Google Developer’s Guide, but this is event tracking made simple… so I will skip all the technical jargon. You can review Google’s guide here if you want to learn more.

Here is a quick reference guide for the elements of HTML code that we will be defining in the next step (bear with me, it’s actually not as bad as it seems).

Universal Analytics (analytics.js)

ga(‘send’, ‘event’, ‘category’, ‘action’, ‘label’, value);

Anatomy of event tracking defined:

• category (required)
  • “The name you supply for the group of objects you want to track.”
  • This is important because it determines how your data will be organized in Google Analytics. It can be anything you want really… let’s say you have 5 contact forms throughout your site you want to track. You could make the category for each one “contact”.
• action (required)
  • “A string that is uniquely paired with each category, and commonly used to define the type of user interaction for the web object.”
  • Using the contact form example above, the action here would simply be “submit.” Some other situations may be appropriate for using “click,” “download,” “play,” etc.
• label (optional)
  • “An optional string to provide additional dimensions to the event data.”
  • I typically make this the URL or {{Page Path}}. That way it is easy to identify where the event took place. Using our contact form example, if a user fills out a form on our contact page I will be able to see in Google Analytics when someone “submits”(action) a “contact” form (category) from the “/contact/” page(label).
• value (optional)
  • An integer that you can use to provide numerical data about the user event.
  • Honestly, in most cases this is unnecessary… but, if you want to go the extra mile, you can define the value you place on the particular event. Learn more about calculating the value of your visitors here.
• non-interaction (optional)
  • A boolean that when set to true, indicates that the event hit will not be used in bounce-rate calculation.
  • This can be useful if you are tracking an event that takes a user off of your website (which, honestly, if you are linking off your website you should always open in a new window!). This will exclude your click from being counted as a bounce.

Now that you understand the basics of what event tracking is and why you should be using it… here is where I want to make this easy for you.

Google Tag Manager vs. Hardcoding

What if I told you that there is a more flexible way to implement tracking on your website, that doesn’t involve hard coding every page but follows the same anatomy structure of event tracking that you just read about? To be clear, Google Tag Manager is not a replacement for Google Analytics. Google Tag Manager is simply, as the name suggests, a “tag manager”. It has no reporting capabilities because that is still handled by Google Analytics. Think of tag management as the middle man. Google Tag Manager is a tag management system that includes the same functionality as global site tags and lets you configure and instantly deploy tags on your website or mobile app from an easy-to-use web-based user interface.

Some key benefits of using Google Tag Manager are:

1. Removes the need for editing website code over and over again. Through the GTM user interface you can add, edit, enable, disable or remove any tag with just a few button clicks.
2. Test and deploy tags quickly. Adapt rapidly and cost-efficiently in response to changes in marketing conditions, search engine, and social media landscapes. You need to move fast and GTM empowers you with its functionality. 
3. Advanced analytics tracking made possible. GTM provides many built-in tags and variables through which you can implement advanced tracking in a short amount of time. 
4. Efficient tag management. When you have dozens of tags for marketing and analytics on your website, having it all in one place can be a lifesaver. 
5. Improve website speed. GTM tags are deployed asynchronously, meaning a slow loading tag will not block other tags from being fired or executed. 

Let’s start off with an example of how to set up tracking for a “Contact Us” button on your homepage. You want to track and see how many people are clicking this button. 

Setting up a Trigger 

The trigger tells the tag to fire when the specified event is detected. Every tag must have at least one trigger in order to fire. Let’s name the trigger “Button – Contact Us”.

Trigger Type 

Since we are tracking clicks, we want to use Click – All Elements.

Trigger Fire on 

This indicates when the trigger will fire and sends a signal to Google Analytics that an event is occurring. We are selecting “Some Clicks” because we only want to focus on the contact us button. If we did all clicks, it would track every click on the page. 

Firing Conditions 

This is telling the trigger exactly when to fire and send the signal. Let’s set this up as “Click Text – equals – Contact Us”. This will fire this trigger when the text on the button is equal to Contact Us. This ensures that it will not trigger any other button on your page, because it has to specifically say “Contact Us”. 

Now, save the trigger.

Setting up a Tag 

Now that we have that setup, we must create the tag that corresponds to the trigger. The tag’s job is to send the information to Google Analytics on what event was triggered. Let’s name the tag “GA Event – Contact Us Button”.

Tag and Track Type

Google Analytics: Universal Analytics. (This corresponds to the platform it’s sending information to.) The Track Type will be Event.

The next steps will be similar to the anatomy of event tracking that you previously read. 

• Category – Contact Us
• Action – Button
• Label –  {{Page Path}}
  I chose Page Path because there might be multiple Contact Us buttons throughout your site and with this variable, you can understand which page they are clicking the button on.
• Google Analytics Settings – this corresponds to your tracking ID which connects your Google Analytics to your GTM account. 

Once all of that is set up, you will connect the corresponding trigger we just created in the previous step to your tag. If you forget to do it, the tag manager will remind you because every tag needs to be connected to a trigger. Save your tag. 

Once you’ve tested your tags and triggers in preview mode and published it in your Google Tag Manager account, you’re all set to set up conversion tracking in Google Analytics! Keep your goals organized by grouping similar events in Google Tag Manager into the same category. Since Google Analytics (UA) limits you to 20 goals per view, instead of creating a separate goal for every contact form event you have on your site, put them all into the same category of “contact”. The events will come through individually in your Google Analytics data because of how you set up each event in GTM, but your goals will be structured in a much more organized way. 

And there you have it! That’s how you can easily set up event tracking using Google Tag Manager. Did I forget to mention that GTM is free to use? There are no monthly or yearly fees! Hopefully, you’ve learned something today that you can go forth, improve your website, and increase your goal conversions. Happy tracking!