Creating and using events

Events mark important moments in a visitor's session, such as signing up, viewing a product, adding it to the cart or opening the checkout. Once you set up an event, Strabber records each time it happens, so you can:

• See how often the event happens and how many users triggered it.
• Find the recordings where it happened.
• Spot it on the timeline of a recording.
• Filter recordings by event.

Event types

There are three types of event:

• Custom: triggered by a line of JavaScript that you add to your website. Use it for actions only your code knows about, such as a completed sign-up or a successful payment.
• In audience: triggered automatically when a visitor matches an audience you've set up. No code needed.
• Not in audience: triggered automatically when a visitor doesn't match an audience.

Create an event

1. Open Events and click Create event.
2. Enter an Event name, or click one of the examples: User registration, Product viewed, Product added to cart or Checkout page opened.
3. Choose the Type: Custom, In audience or Not in audience.
4. Click Create.

The event opens so you can finish setting it up.

Configure the event

• State: Enabled or Disabled. Strabber only records events that are enabled.
• Type: fire the event with JavaScript code (Custom) or by audience (In audience / Not in audience). You can change this later.
• Audience: for audience events, choose which audience triggers the event. If the audience is disabled, enable it first, or the event won't fire.
• Devices: record the event on Desktops, Smartphones, Tablets, or any combination.
• Nature: mark the event as Positive (for example, a purchase), Negative (for example, a failed payment) or Neutral. You can then filter recordings by the nature of their events.
• Event color: the color used to highlight the event in the recording player.

Trigger a custom event

Custom events need a line of code on your website. You'll find the code for each event in its Tracking code section. Copy it from there, as it already contains the event's ID:

<!-- Strabber Event Code -->
<script>
    strabber('event.trigger', 'YOUR_EVENT_ID')
</script>
<!-- Strabber Event Code -->

The Strabber tracking code must be installed on the page where the event happens, or the event won't be recorded.

Where you put the event code depends on when the event should fire:

• When a page opens: add the code to that page, for example to your order confirmation page to track purchases.
• When a visitor does something: call strabber('event.trigger', ...) from your own JavaScript at that moment, for example when a visitor submits a sign-up form:

form.addEventListener('submit', () => {
    strabber('event.trigger', 'YOUR_EVENT_ID');
});

Each call records the event once, at the moment it's made.

See where an event happened

On the event's page

Each event's page shows:

• Its Event ID, Status and when it was Created.
• Occurrences: how many times the event has been triggered.
• Users interacted: how many users triggered it.
• Recent recordings with event and Recent logs with event.

Click View event recordings to open the recordings list filtered to sessions with this event.

In the events list

The Events page lists all events with their name, identifier, nature, status and number of occurrences. The sidebar groups them into Active and Inactive. From the menu of each event you can View recordings, Clone event or Delete it.

In recordings

• In the recordings list, sessions with events are marked with an event icon. Hover over it to see how many events were triggered. Use the Event and Nature filters to find sessions with specific events.
• In the recording player, events appear as markers above the progress bar in the event's color, and are listed in the Events section of the sidebar.

Clone or delete an event

The menu on the event's page, and the menu of each event in the list, let you:

• Clone the event, creating a copy with the same settings.
• Delete it.

If you delete a custom event, remove its code from your website too.