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
• Tab switches
• Any other user interaction

Event Structure

Events in Ghost Metrics have four components:

Tracking Events with Tag Manager

Ghost Metrics Tag Manager is the recommended way to track events. You can configure event tracking in the Tag Manager interface without writing code.

Common Tag Manager Triggers

• Click triggers — Track clicks on specific elements
• Form submit triggers — Track form submissions
• Scroll depth triggers — Track how far visitors scroll
• Timer triggers — Track time-based events
• Custom event triggers — Listen for data layer events

Contact support or refer to your Tag Manager documentation for help configuring triggers.

Tracking Events with JavaScript

You can also push events directly via JavaScript:

Basic Event

_mtm.push({
  'event': 'trackEvent',
  'eventCategory': 'Category',
  'eventAction': 'Action'
});

Event with Name

_mtm.push({
  'event': 'trackEvent',
  'eventCategory': 'Form',
  'eventAction': 'Submit',
  'eventName': 'Contact Form'
});

Event with Name and Value

_mtm.push({
  'event': 'trackEvent',
  'eventCategory': 'Video',
  'eventAction': 'Play',
  'eventName': 'Welcome Video',
  'eventValue': 120
});

Common Event Examples

Button Clicks

document.getElementById('signup-btn').addEventListener('click', function() {
  _mtm.push({
    'event': 'trackEvent',
    'eventCategory': 'Button',
    'eventAction': 'Click',
    'eventName': 'Sign Up Button'
  });
});

Form Submissions

document.getElementById('contact-form').addEventListener('submit', function() {
  _mtm.push({
    'event': 'trackEvent',
    'eventCategory': 'Form',
    'eventAction': 'Submit',
    'eventName': 'Contact Form'
  });
});

File Downloads

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

Outbound Links

document.querySelectorAll('a[href^="http"]').forEach(function(link) {
  if (!link.href.includes(window.location.hostname)) {
    link.addEventListener('click', function() {
      _mtm.push({
        'event': 'trackEvent',
        'eventCategory': 'Outbound Link',
        'eventAction': 'Click',
        'eventName': this.href
      });
    });
  }
});

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;
      _mtm.push({
        'event': 'trackEvent',
        'eventCategory': 'Scroll Depth',
        'eventAction': threshold + '%',
        'eventName': window.location.pathname
      });
    }
  });
});

Viewing Event Data

Find your event data in Behavior → Events.

Event Reports Show:

• Event Categories — All categories with total actions
• Event Actions — Actions within each category
• Event Names — Specific event names and counts
• Event Values — Total and average values (if tracked)

You can drill down from Category → Action → Name to see detailed breakdowns.

Using Events as Goals

Events can trigger goal conversions. 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

Use your browser’s developer console to verify events fire correctly before pushing to production:

// Temporarily log events to console
window._mtm = window._mtm || [];
var originalPush = _mtm.push;
_mtm.push = function() {
  console.log('MTM Event:', arguments);
  return originalPush.apply(_mtm, arguments);
};

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