Custom events

Custom events allow you to measure button clicks, purchases, subscription signups, form completions and pretty much any other action that you wish your visitors to take.

"Custom events" is an optional enhanced measurement that's not included in our default script. This is because we want to keep the default script as simple and lightweight as possible.

Add a CSS class name to the element you want to track on your site

This feature allows you to track user interactions on your site by adding a CSS class to the target element. The class follows a specific format to define an event name.

Usage

To track an element, simply add a CSS class in the format:
histat-event-name=EventName

Example

Before tracking:

<button>Click Me</button>

After adding the tracking class:

<button class="histat-event-name=ButtonClick">Click Me</button>

In this example, clicking the button will trigger an event named "ButtonClick", which can be recorded and analyzed.

Create a custom event goal in your Histat account

When you send custom events to Histat, they won't show up in your dashboard automatically. You'll have to configure the goal for the conversion numbers to show up.

To configure a goal, go to your website's settings in your Histat account and visit the "Goals" section.

Click on the "+ Add goal" button to go to the goal creation form.

Select Custom event as the goal trigger and enter the name of the custom event you are triggering. The name must match the one you added as a CSS class name on your site for conversions to appear in your analytics dashboard. So in our example where you added a CSS class name histat-event-name=ButtonClick, the goal to add to your Histat account is ButtonClick.