Event Tracking

Track specific user interactions beyond pageviews.

What Are Events?

Events let you measure specific actions visitors take on your website that aren’t captured by standard pageview tracking. This includes:

• Button clicks
• Form submissions
• File downloads
• Video plays
• Scroll depth
• Menu interactions
• Any other user interaction

Event Structure

Events in Ghost Metrics have four components:

An event needs at least a category and an action to be recorded. When you don’t need the name or value, simply leave the trailing parameters off rather than passing blanks.

Tracking Events with JavaScript

Once the Ghost Metrics container has loaded on the page, the tracking API is available through the _paq queue:

// Category and action
_paq.push(['trackEvent', 'Menu', 'Click']);
 
// With a name
_paq.push(['trackEvent', 'Form', 'Submit', 'Contact Form']);
 
// With a name and a numeric value
_paq.push(['trackEvent', 'Video', 'Play', 'Welcome Video', 120]);

The signature is trackEvent(category, action, [name], [value]).

Common Event Examples

Button Clicks

document.getElementById('signup-btn').addEventListener('click', function() {
  _paq.push(['trackEvent', 'Button', 'Click', 'Sign Up Button']);
});

Form Submissions

document.getElementById('contact-form').addEventListener('submit', function() {
  _paq.push(['trackEvent', 'Form', 'Submit', 'Contact Form']);
});

File Downloads

document.querySelectorAll('a[href$=".pdf"]').forEach(function(link) {
  link.addEventListener('click', function() {
    _paq.push(['trackEvent', 'Download', 'PDF', this.getAttribute('href')]);
  });
});

Note that clicks on file links and outbound links are also tracked automatically as Downloads and Outlinks reports — explicit events like the above are only needed when you want them grouped your own way.

Scroll Depth

var scrollTracked = {};
 
window.addEventListener('scroll', function() {
  var scrollPercent = Math.round((window.scrollY / (document.body.scrollHeight - window.innerHeight)) * 100);
 
  [25, 50, 75, 100].forEach(function(threshold) {
    if (scrollPercent >= threshold && !scrollTracked[threshold]) {
      scrollTracked[threshold] = true;
      _paq.push(['trackEvent', 'Scroll Depth', threshold + '%', window.location.pathname]);
    }
  });
});

Tracking Events with Tag Manager

You can also configure event tracking in the Ghost Metrics Tag Manager container — useful when you’d rather manage tracking without touching site code. Built-in trigger types include clicks on elements, form submissions, scroll reach, element visibility, timers, and custom events from the data layer.

The Data Layer Pattern

Your site can push named events with data into the container’s data layer:

window._mtm = window._mtm || [];
_mtm.push({
  'event': 'formSubmitted',
  'formName': 'Contact Form'
});

For this to record anything, the container must be configured to consume it:

1. Trigger — Create a Custom Event trigger whose event name matches (formSubmitted)
2. Variables — Create Data Layer variables for each data key you push (formName)
3. Tag — Create an analytics tag with Tracking Type: Event, filling the category/action/name/value fields from those variables, fired by your trigger
4. Publish the container version

A data-layer push with no matching trigger and tag does nothing — the key names carry no built-in meaning. If you’d like help setting up container-based event tracking, contact support.

Viewing Event Data

Find your event data in Behavior → Events.

Event Reports Show:

• Event Categories — All categories with total events
• Event Actions — Actions within each category
• Event Names — Specific event names and counts
• Event Values — Total, average, minimum, and maximum values (when tracked)

You can drill down from Category → Action → Name to see detailed breakdowns, and switch the secondary dimension in the report footer. Individual events also appear on each visit in Visitors → Visits Log — the quickest way to confirm a new event is firing.

Using Events as Goals

Events can trigger goal conversions — the goal matches on the event’s category, action, or name (exact match, contains, or regular expression), and the event’s value can even be used as the goal’s revenue. This is useful for tracking:

• Form submissions as leads
• Button clicks as conversions
• Video completions as engagement goals

See Goals to learn how to create event-based goals.

Best Practices

Use Consistent Naming

Establish naming conventions and stick to them:

• Categories: Use broad groupings (Form, Video, Button, Download)
• Actions: Describe what happened (Submit, Play, Click, Download)
• Names: Be specific but concise (Contact Form, Hero Video, CTA Button)

Don’t Over-Track

Track events that provide actionable insights. Tracking everything creates noise and makes it harder to find meaningful data.

Test Before Deploying

Verify events fire correctly before relying on them:

1. Open your browser’s developer tools → Network tab, filter for your analytics domain, and confirm a tracking request fires when the event happens
2. Check Visitors → Visits Log (with the date set to today) for the event on your own visit

Document Your Events

Keep a record of what events you’re tracking, their naming conventions, and their purpose. This helps your team stay consistent.

Next Steps

• Set up goals — Convert events into measurable goals
• Track campaigns — Measure marketing performance
• View behavior reports — Analyze user interactions