Track Events

Events are the core of OpenPanel. They allow you to measure specific actions users take on your site, like clicking a button, submitting a form, or completing a purchase.

Tracking an event

To track an event, simply call the track method with an event name.

op.track('button_clicked');

Adding properties

You can add additional context to your events by passing a properties object. This helps you understand the details of the interaction.

op.track('signup_button_clicked', {
  location: 'header',
  color: 'blue',
  variant: 'primary'
});

Common property types

• Strings: Text values like names, categories, or IDs.
• Numbers: Numeric values like price, quantity, or score.
• Booleans: True or false values.

Using Data Attributes

If you prefer not to write JavaScript, you can use data attributes to track clicks automatically.

<button 
  data-track="signup_clicked" 
  data-location="header"
>
  Sign Up
</button>

When a user clicks this button, OpenPanel will automatically track a signup_clicked event with the property location: 'header'.