Getting started with event tracking

This guide will help you to get started with event tracking.

• What are events and why should I track them?
• Setting up event tracking
• Tracking YouTube Videos
• Defining category, action, and label 
• Tracking limitations 
• Event tracking analysis 
• Additional resources

What are events and why should I track them?

What are events? 

Whenever someone views a page on your website, the Siteimprove tracking script makes sure that a page view is counted. This is because the script registers that the page has been loaded in their browser. 

Interactions that don’t trigger a reload of the page are not tracked by the Siteimprove script by default. 

This means that you are not automatically tracking interactions such as: 

• Clicks on play, pause, or stop on embedded audio or video content. 
• Clicks that open a lightbox or pop-up, includin image galleries. 
• Clicks that reveal or hide content on the page. 
• Clicks that submit forms without loading a new page. 

This is where event tracking comes in handy. 

Why track events? 

Tracking events is useful when you want to see if people are interacting with your website in the way you expect them to.  

Once event tracking is set up, you will be able to: 

• Measure how many times certain events occur. 
• See which pages on your website generate the most events. 
• Include events in your key metrics and funnel analysis. 
• Filter your analytics data by visitors who performed certain events on your website. 

Note: Tracking events will not impact the number of page views to a page. 

Setting up event tracking

There are three ways to set up event tracking: 

1. Add events in tracking tool (no code required) 
2. Quick-add events (no code required) 
3. Instal the event tracking code (requires access to your website’s code) 

Note: All users can view event tracking configurations. Only administrators or account owners can add, edit, or delete configurations. 

Option 1: Adding events in tracking tool (no code) 

1. Navigate to the Events section in Marketing Analytics. 
2. Click on the “Edit event configurations” button. 
3. Click on the “Edit events in on-page tool” button. 
4. Select the site you want to track events on. 
5. Select the page you want to track events on by searching for the page title or URL. 
6. Interact with the page (e.g. open dropdowns or accordions) to reveal the element you want to add tracking to. You can also change the device to see your page at different breakpoints. 
7. Click the “Add event” button. 
8. Click on the element you want to add tracking to. 
9. The “CSS selector” field will populate automatically. If you make changes to its contents, please check your website code to ensure that the CSS selector is correct. 
10. Assign label, action and category to the event. 
11. Select the pages you want to track the element on.  
12. Click “Save."

Option 2: Quick-adding events (no code required) 

Note: This option is recommended for assistive technology users. 

1. Navigate to the Events section in Marketing Analytics. 
2. Click on the “Edit event configurations” button. 
3. Click on “Quick-add events."
4. Enter the CSS selector of the element you want to add tracking to. You can find the CSS selector of an element by inspecting the code of your website. 
5. Assign label, action and category to the event. 
6. Select which pages you want to track the element on.  
7. Click “Save.”

Option 3: Installing the event tracking code (requires access to your website’s code) 

The code you'll need to add is: 

onclick="_sz.push(['event', 'CATEGORY', 'ACTION']);" 

If you want it with the optional label on the event, you can add: 

onclick="_sz.push(['event', 'CATEGORY', 'ACTION', 'LABEL']);" 

All you have to do is replace  CATEGORY, ACTION, and LABEL with your preferred option. 

Example 1: 

If you want to track a link on a page that reveals some _hidden text about enrolling, the original link might look like this: 

<a href="...example.com#fulltext">Read the full text about enrolling</a> 

Then you can update it to: 

<a href="...example.com#fulltext"  
 onclick="_sz.push(['event', 'Content', 'Show more', 'Enrolling']);"> 
 Read the full text about enrolling</a> 

The category is "Content," the action is "Show more," and the label (further detail) is "Enrolling."

Tracking YouTube Videos

To track YouTube videos the following conditions must be met:

1. Video links should be embedded (i.e. not presented in a pop-up window)
2. Video links need to have the 'enablejsapi=1' parameter added to the video link.

For example: 

 <iframe .. src="//www.youtube.com/embed/XXX?enablejsapi=1

Note: There are limitations to what can be tracked and this is dependent on YouTube’s API. Detailed analytics are available within the YouTube studio interface.

Defining category, action, and label 

Every event requires a category, action, and label. This is to help you categorize user interactions so that you can identify them when you perform your analysis. 

Category 

Typically, the category details what type of element the event was actioned on, such as; video, audio, image, form or content. It offers a way to group the different types of events you are tracking. 

Action 

The action matches the interaction that was performed e.g. play, pause, open, submit. 

It is best, again, to think about what actions you want to track in relation to the categories you have selected, and whether it is acceptable to have general actions that are used across multiple categories or whether you want to select specific actions for each category. 

In an example from the Siteimprove website, the User Feedback tab has two actions that pertain to tracking. The first is when the user opens the tab and the second is when a user completes the feedback. So both events fall under the same category "Feedback," but each have distinct actions. 

Label

If you have multiple events with the same category and action on the same page, you can add a label to each to distinguish them from each other. Labels can also be used to improve the readability of your data.

A label can be the title of the video or the heading of a content section - anything that uniquely identifies which element the user interacted with.

In this example, the user wants to track tabs being clicked on the front page. The tabs all fall under the same category "Content" and the same action "tab", so the Label element in the script can be used to distinguish the tabs - "Apply," "Pay," and "Report."

Tracking limitations 

Advanced event tracking 

With no-code event tracking, you can only track clicks on elements on your page. If you need more advanced event tracking, please fill out the event tracking spreadsheet and send it to support@siteimprove.com. 

Note:  Event configurations created by Support or by installing the event tracking code will not be displayed in the “Event configurations” view.

Iframes
Most of the time, it is not possible to track iframes if the Siteimprove script is not loaded on the page in the iframe. Tracking may work if you add the script to the iframe page, but this is typically not possible as it is third-party content. 

HTML5 videos in iframe
Unfortunately, we are unable to track HTML5 videos in iframes. 

Vimeo videos
Interactions with embedded Vimeo videos are unfortunately unable to be tracked. 

Event tracking analysis 

Once you identify the elements you want to track, and the tracking code has been added accordingly, then you can follow these events within Event Tracking in Analytics. 

The Event Tracking section provides an overview of events: 

It is divided up into 4 sub-sections: Category, Action, Label, and Pages.

Additional resources

• Event Tracking: Naming convention best practices