How to Set Up Event Tracking in Umami Analytics

Updated: August 2026

Pageviews tell you which pages people visit. Events tell you what people actually do.

With event tracking in Umami Analytics, you can measure actions such as button clicks, form submissions, downloads, video plays, sign-ups, and other interactions that matter to your website.

This guide walks through the process step by step, from creating an event in Umami to adding the tracking code to your website and checking that everything works.

What Is Event Tracking in Umami?

An event is an interaction that you want to measure separately from a normal pageview.

For example, suppose your website has a Get Started button. A pageview can tell you that someone visited the page containing the button, but it can't tell you whether they clicked it.

An event can.

You might track events such as:

  • signup
  • contact_form
  • download
  • pricing_click
  • newsletter_signup
  • video_play

The exact events you create should reflect the actions that are important to your website or product.

Step 1: Open Your Website in Umami

Log in to your Umami Analytics account and open the website you want to track.

Before creating events, make sure Umami's standard pageview tracking is already working. If you can see current visitors and pageviews for your website, you're ready to start adding event tracking.

Step 2: Decide Which Actions to Track

Before adding code, make a short list of the interactions you actually care about.

Avoid tracking every possible click just because you can. Too many low-value events can make your analytics harder to understand.

A useful starting point might be:

User action Event name
Clicks a signup button signup
Submits a contact form contact_form
Downloads a PDF download
Clicks a pricing button pricing_click
Subscribes to a newsletter newsletter_signup

Use consistent, descriptive names. Lowercase names with underscores are easy to read and work well as a naming convention.

Step 3: Make Sure the Umami Tracking Script Is Installed

Your website needs the Umami tracking script before it can send event data.

The script is normally added to the <head> section of your website.

A typical Umami installation looks similar to this:

<script
  defer
  src="https://your-umami-instance.example/script.js"
  data-website-id="YOUR-WEBSITE-ID">
</script>

Replace the URL and website ID with the values provided by your Umami installation.

If you're using Umami Cloud, use the tracking script and website ID supplied by your Umami dashboard.

Once the script is installed, verify that normal pageviews are being collected before troubleshooting events.

Step 4: Add an Event to an Element

Once the tracking script is active, you can tell Umami which interaction should generate an event.

For example, you might have a signup button:

<button id="signup-button">
  Get Started
</button>

You can attach an event listener and send an event when the button is clicked:

<script>
  document
    .getElementById('signup-button')
    .addEventListener('click', function () {
      umami.track('signup');
    });
</script>

When a visitor clicks the button, Umami receives a signup event.

This is the basic pattern:

User interaction → umami.track() → Umami records the event

Step 5: Track an Event Directly From a Link

You can also track clicks on links.

For example:

<a href="/pricing" id="pricing-link">
  View Pricing
</a>

<script>
  document
    .getElementById('pricing-link')
    .addEventListener('click', function () {
      umami.track('pricing_click');
    });
</script>

Now you can distinguish visitors who merely viewed a page from visitors who actively clicked your pricing link.

Step 6: Add Properties When You Need More Detail

Sometimes knowing that an event happened isn't enough.

For example, you might have several different signup buttons. Instead of creating separate event names such as:

  • signup_home
  • signup_pricing
  • signup_footer

you can use one event name and attach additional information.

For example:

umami.track('signup', {
  location: 'pricing'
});

This gives the event additional context.

You can use event properties to answer questions such as:

  • Where was the button clicked?
  • Which plan was selected?
  • Which type of content was downloaded?
  • Which product was viewed?
  • Which version of a page generated the interaction?

Keep properties useful and consistent. A small number of meaningful properties is generally more valuable than a large collection of inconsistent ones.

Step 7: Track Form Submissions

Forms are one of the most useful places to use event tracking.

For example:

<form id="contact-form">
  <input type="email" name="email" required>
  <button type="submit">Send</button>
</form>

<script>
  document
    .getElementById('contact-form')
    .addEventListener('submit', function () {
      umami.track('contact_form');
    });
</script>

This records the event when the form is submitted.

For important conversions, consider tracking the event only after the submission has actually succeeded rather than merely when the visitor clicks the submit button. That prevents failed submissions from being counted as successful conversions.

Step 8: Test Your Event

Don't assume that an event is working just because the JavaScript looks correct.

Open your website and perform the action yourself.

For example:

  1. Open the page containing the tracked button.
  2. Click the button.
  3. Return to Umami.
  4. Open the relevant analytics/event view.
  5. Check whether the event appears.

Depending on your Umami version and configuration, there can be a short delay before the event becomes visible.

If you don't see the event, check:

  • That the Umami script is loading.
  • That the website ID is correct.
  • That you're viewing the correct website in Umami.
  • That the browser isn't blocking the tracking request.
  • That your JavaScript runs after the relevant element exists.
  • That there are no JavaScript errors in the browser console.
  • That the event name and umami.track() call are correct.

Step 9: Start Using Events in Your Analysis

Once your events are being collected, they become much more useful than a simple list of clicks.

For example, suppose you want to understand how effectively your homepage generates signups.

You can compare:

Homepage visits → signup events

Likewise, you might compare pricing-page visitors with pricing-button clicks, or article readers with newsletter signups.

The goal isn't simply to collect events. It's to use them to answer specific questions about how visitors interact with your website.

Common Event-Tracking Mistakes

Tracking Everything

You don't need an event for every button, link, or hover.

Start with actions that represent meaningful user intent or business outcomes.

Using Inconsistent Event Names

Avoid having variations such as:

Signup
sign_up
signup-button
userSignup

Pick a naming convention and stick with it.

Tracking Clicks Instead of Successful Outcomes

A click on a form's submit button doesn't necessarily mean the form was successfully submitted.

When possible, trigger important conversion events after the action has actually succeeded.

Forgetting to Test

A tiny JavaScript error can prevent an event from being sent. Always test important events yourself before relying on the data.

A Simple Event-Tracking Strategy

If you're just getting started, don't try to build a massive tracking system on day one.

Start with three categories:

1. Acquisition

Track actions that show how visitors engage with your content or marketing.

Examples:

  • CTA clicks
  • Campaign interactions
  • Important outbound links

2. Engagement

Track meaningful interactions with your website.

Examples:

  • Video plays
  • Downloads
  • Search usage
  • Content interactions

3. Conversion

Track actions that represent your primary goals.

Examples:

  • Account creation
  • Contact form submission
  • Purchase
  • Subscription
  • Demo request

This gives you a much clearer picture of the visitor journey without filling your analytics with noise.

Final Thoughts

Setting up event tracking in Umami is fundamentally about connecting user actions to useful questions.

Start by identifying the interactions that matter, give those events consistent names, add the appropriate umami.track() calls, and then test everything before using the data for decisions.

Once your basic events are working, you can add properties to provide additional context and build a much more useful picture of how visitors interact with your website.

The best analytics setup isn't the one that tracks the most things. It's the one that helps you understand what your visitors are doing and why.

For more practical walkthroughs, explore our other Umami analytics guides.

Get Started with Managed Umami

Ready to try Umami without the DevOps hassle? UmamiEngine provides fully managed Umami analytics with all the depth described above, including funnels, retention, journeys, attribution, and revenue insights. No servers, no databases, no maintenance, just privacy-first analytics in minutes. Get started today and take control of your analytics data.

Get fully managed Umami in minutes