Custom Events

Track any user action with a simple CSS class. No JavaScript required.

The basics

Want to track button clicks, form submissions, or any user interaction? Just add a CSS class. That's it.

Super Simple: Add data-track-event="event-name" to any HTML element. Done.

Quick example

Let's track a "Sign Up" button click:

html
Loading editor...

That's all you need! When someone clicks this button, you'll see "signup_clicked" in your dashboard events.

Event naming tips

Use clear, descriptive names that make sense at a glance:

Good Examples

  • signup_clicked
  • video_played
  • pricing_viewed
  • demo_requested

Avoid These

  • click (too vague)
  • btn1 (unclear)
  • Event123 (meaningless)
  • user-action-performed (too long)
Pro Tip: Use underscores (signup_clicked) or hyphens (signup-clicked) for multi-word events. Stay consistent!

Common use cases

Here are real-world examples you can copy and paste:

1. Button Clicks

html
Loading editor...

2. Form Submissions

html
Loading editor...

3. Link Clicks

html
Loading editor...

4. Video & Media

html
Loading editor...

Track multiple events

You can track as many events as you want. Just add the attribute to each element:

html
Loading editor...

Viewing your events

Once you've added tracking to your elements, here's where to find the data:

1.

Go to your Dashboard

Select your website from the dropdown

2.

Navigate to Events tab

You'll see all your custom events listed

3.

View metrics

See total count, unique users, and trends over time

Best practices

Be specific but concise

Use signup_hero instead of just signup if you have multiple signup buttons

Use consistent naming

Pick a pattern (underscores or hyphens) and stick with it across your site

Track what matters

Focus on actions that indicate user engagement or conversion intent

Test first

Add tracking, trigger the event, and verify it appears in your dashboard

Troubleshooting

Events not showing up? Check these common issues:

❌ Tracking script not installed

Make sure you've added the tracking script to your website's <head> section

❌ Typo in attribute name

Double-check: it's data-track-event, not data-event or track-event

❌ Event not triggered

Click/interact with the element to trigger the event. It won't show up until someone actually uses it

❌ Ad blocker enabled

Some ad blockers may prevent tracking. Try disabling it or test in incognito mode

Next steps

Now that you're tracking custom events, take it further:

  • Set up Goals to track conversions from your events
  • Create Funnels to see how events connect in user journeys
  • Combine events with UTM parameters for campaign tracking