Back to Blog

Setting up event tracking for button clicks and other actions

Published on: 2023-9-19 Setting up event tracking for button clicks and other actions

What does event tracking mean?

Event Tracking is a method used in web analytics to measure and record interactions users have with individual elements of a website or a mobile application. Instead of just capturing pageviews, event tracking allows you to monitor specific behaviours and actions taken within a page.

Examples of interactions you might track with event tracking include:

  • Clicking on a button (e.g., a “Sign Up” or “Download” button).
  • Playing, pausing, or stopping a video.
  • Submitting a form.
  • Downloading a file (like a PDF).
  • Collapsing or expanding a dropdown menu or content section.

How event tracking differs from standard pageview tracking

Standard pageview tracking is like counting how many people enter a store. It tells you how many times a webpage gets looked at. If someone visits the homepage, product page, or about page, each visit gets counted. It's all about seeing which pages on a website are popular and how long people stay.

Event tracking, however, is more about what people do once they're inside that store. Instead of just counting visits, it looks at actions. Did someone press a button, watch a video, or download a file? It's like watching someone in the store try on a hat, test a gadget, or read a product label. This tells you more about what people really want to see and do on a page.

Why should you keep track of button clicks on websites?

It's important to follow when people click on buttons on websites for many reasons:

  • Conversion Optimization – Buttons often represent key conversion points on a website, such as “Add to Cart,” “Sign Up,” or “Download.” By tracking these clicks, businesses can understand their conversion funnel and pinpoint areas for improvement.
  • User Behaviour Analysis – Understanding which buttons users interact with can provide insights into their preferences, behaviours, and the journey they take on the site. This data can guide design improvements and content prioritization.
  • Efficiency of Call-to-Action (CTA) – Not all CTAs are created equal. By monitoring button clicks, businesses can A/B test various CTAs to determine which ones resonate most with users, optimizing for better engagement and conversion rates.
  • Resource Allocation – If certain features or offers (represented by buttons) are not receiving much interaction, businesses can decide whether to improve or remove them, thereby allocating resources more efficiently.
  • Tech & Usability Issues – If a button that's supposed to receive frequent clicks isn't being clicked, it might be malfunctioning, or there could be a usability issue preventing users from interacting with it. Tracking can help identify such anomalies.
  • Mobile vs. Desktop Behaviour – Button interaction can vary between mobile and desktop users. Tracking helps in understanding this dynamic, ensuring optimal user experience across all devices.
  • External Link Tracking – If buttons link to external sites or resources, tracking those clicks can provide insights into how often users are leaving the site and for what reasons.
  • Refinement of Marketing Strategies – Businesses can refine their marketing campaigns by understanding which buttons (or offers) gain the most traction.
  • Monetization – For affiliate websites or advertising models, tracking button clicks can help in understanding which products or ads are most appealing to the audience. This can guide decisions on partnerships or ad placements.
  • Content Strategy – On content-rich websites, buttons might lead to different types of content (e.g., videos, articles, podcasts). Understanding which content types are most clicked can guide the future content strategy.

This gives a better look at user intent, engagement, and website performance. Such data-driven insights enable businesses to make informed decisions, ensuring that the website serves its intended purpose effectively.

How to get started?

We established that tracking button clicks on websites is crucial as it enables businesses to optimize conversions, understand user behaviour, test the effectiveness of calls-to-action, and allocate resources efficiently. It also helps identify technical difficulties, adjust strategies based on device usage, monitor external link engagement, refine marketing tactics, make informed decisions on monetization, and shape content strategy based on user interactions.

Phew, that's a lot.

First, focus on your goals

Depending on your goals, you have want to track different types of events. These will greatly depend on your website, audience, and marketing strategy. What follows are high-level example that can give you a rough idea when thinking about event tracking.

  • Tracking white paper downloads on a website – Many enterprise vendors, especially those aiming to become an authority in their industry, publish rich and informative PDFs. These documents are used to lure prospect to leave their contact details for sale force to do their magic. If you attach the event to a download link or button, you can identify the source of audience that expresses the biggest interest. Knowing which marketing channel works can later support your marketing strategy. 
  • Detecting usability issues – Your engaged audience which spends lots of time on your blog and maybe even visits the pricing page does not convert. How come? Are they not clicking on the Start Trial button? Or perhaps they are not seeing the button. Being able to track when users click, or even hovers over, the CTA button can be a useful data point in your usability testing. Even better if you can have multiple versions of the website and compare results side by side. 
  • Audience purchasing habits – Your SaaS might offer a great deal on annual subscription. But what if you saw users getting to the pricing page, and immediately pulling on the toggle to switch to monthly pricing. The common wisdom of Growth Hackers might not apply to your business. Your audience might be less frustrated with monthly first pricing. 
  • Sales Attribution – In some cases, attribution sales or other commercially viable outcome cannot be attributed to just a page visit when it originated from. Identifying which of many CTAs yields the best conversion when segmented by traffic can indicate very real patterns expressed by different types of audience.

A step-by-step guide on how to start tracking events

You should start by creating an account on a web analytics platform that supports event tracking. Wide Angle Analytics is a highly recommended option that provides a comprehensive range of events and side-by-side comparison dashboards. Do your research and find the tool that works for you. 

Enable Event Tracking

Once you have your account and website analytics configured, it is time to enable event tracking. In your website settings, you should enable the types of events you want to track.

Wide Angle Analytics Event Tracking section in website settings

Wide Angle Analytics supports three types of events:

  • Click Events
  • Download Events
  • Custom Events

Tracking Click Events

Click events enable easy tracking of clicks and touch interaction with a specific element on the website without writing any code. To reduce the number of these events and reduce the noise, the Wide Angle tracker only reacts when a marked HTML element is selected.

To mark an element for tracking, add data-waa-name attribute in the website HTML, for example via WordPress editor. 

<section class="cta">
  <button data-waa-name="subscribe" data-waa-section="top-nav">Subscribe</button>
</section>

When a user presses a button like this, a tracking event of type click with parameters name=subscribe and section=top-nav will be tracked. 

Add a similar button with section set to footer and now you can compare which button yields better conversion.

<section class="cta">
  <button data-waa-name="subscribe" data-waa-section="top-nav">Subscribe</button>
</section>

<!-- rest of the website -->

<footer>
  <button data-waa-name="subscribe" data-waa-section="footer">Subscribe</button>
</ footer >

Tracking Download Events

Wide Angle Analytics provides two distinct tracking modes for download events.

The simplest one is tracking by extension. Any time a file with a commonly used document or archive extension is downloaded, and event will be issued. 

Supported extensions are:  7z, zip, bz2, gz, tar, tgz, tbz, tbz2, z, gzip, rar, apk, deb, rpm, bin, exe, msi, dmg, jar, gif, jpeg, jpg, png, webp, ttf, otf, woff2, acc, ogg, flac, mp3, mp4, mpeg, csv, xls, xlsx, doc, docx, ppt, pptx, pdf, txt.

Alternatively, you can opt for tracking only marked links. This means that, like in the case of the Click Events, you ought to add a special attribute to an HTML element.

<button data-waa-name="buy-button">Buy Now</button>

Tracking Custom Events

There is more to web analytics than page views, exit events, clicks, and downloads. Every website can have unique interactions worth tracking and reporting on.

You might want to track the mere intent of pressing a button, like when the user moves the mouse cursor over the BUY button. Or perhaps when the user reaches a specific section of the page. You can track these special cases with Custom Events.

Unlike Click and Download events, using Custom Events will require calling a bit of JavaScript. Certain Content Management Systems make it straightforward, as do popular No Code solutions like Webflow.

To make this example more specific, imagine a pricing page with three plans: Basic, Plus, and Premium.

An example of SaaS Pricing Page

Moving the cursor over specific pricing boxes could be used to track intent even before the user chooses a plan. Although this is not a precise method of measuring intent, with large enough data sample can offer interesting insights into visitor behaviour.

<main>
  <h1>Pricing</h1>
  <section 
    onmouseover="window.waa.dispatchEvent('buy-intent', {plan: 'basic'});">
    Basic
  </section>
  <section
    onmouseover="window.waa.dispatchEvent('buy-intent', {plan: 'plus'});>
    Plus
  </section>
  <section
    onmouseover="window.waa.dispatchEvent('buy-intent', {plan: 'premium'});>
    Premium
  </section>
</main>

We've discussed how to monitor the way people use a website. Now, let's explore how we can identify patterns and connect sales to marketing channels using the Wide Angle Analytics Actions Dashboard.

Visualizing Tracked Events

To illustrate how to effectively track and analyse events, let's use the example of a newsletter subscription form. The website we aim to monitor has a single form, inviting visitors to subscribe to a newsletter about Pugs. These cute four-legged pals, unfortunately, tend to develop respiratory issues.

A sample form - Newsletter subscription

When users click on the email field, a Custom Event named 'intent' is activated. Subsequently, when the user clicks on the subscribe button (labelled "Yes!" in this instance), a click event with the attribute data-waa-name=subscribe is initiated.

If the subscription CTA appears on multiple sites or even multiple instances on one page, we can include additional parameters to provide a more in-depth analysis of these events.

In summary, we have two main events: the custom 'Intent' event and the 'Subscribe' click event.

As our first step, we'll set up an action filter representing these actions. You can set these up manually or use Wide Angle Analytics' convenient discovery feature.

Once you've defined the 'Intent' and 'Subscribe' actions, you can contrast them in the Actions Dashboard. Here, you can examine statistics and data for one or both tracked events. This interface allows you to segment data based on geography, traffic source, and the specific page where the event occurred.

Check this dashboard on our interactive demo.

What are common mistakes when it comes to tracking events?

Event tracking is crucial for understanding user behaviour on websites and applications. However, several common pitfalls organizations often fall into include:

  • Not Defining Clear Objectives – Before initiating event tracking, you should outline clear objectives for what you want to discern. Without a set aim, it's tempting to either over track, leading to an overwhelming amount of data, or under track, missing vital user interactions.
  • Undertracking: - Failure to monitor essential activities can lead to gaps in understanding user behavior, which can undermine key optimization opportunities.
  • Ignoring Event Context – Solely tracking an event devoid of its context can yield skewed conclusions. For instance, merely noting video plays without evaluating the video's length or completion rates gives a partial view.
  • Failing to Segment Data – By not dividing event data based on aspects like user demographics, device type, or how users found your site, you risk obscuring significant patterns and knowledge.
  • Data Privacy Overlook – Not transparently communicating what you're observing or not presenting users a way to opt-out can spark privacy issues. This can even bear legal repercussions in areas with rigorous data protection regulations.

A quick recap of website event tracking

Tracking events can, and often does, uncover much more meaningful insights than page views alone. Tracking events goes beyond attribution and can lead to much more in-depth understanding of your audience, their behaviour and, when accompanied by segmentation, can yield a very effective digital marketing strategy.

Powerful tools like Wide Angle Analytics allow even those less tech-savvy to start tracking download and click events with just a few clicks.

Looking for web analytics that do not require Cookie Banner and avoid Adblockers?
Try Wide Angle Analytics!