Trigger custom events with hotspots and API timelines in an interactive video


About

This article shows you how to trigger custom actions and track interactions using hotspots and timed API events.

Trigger a custom event from a hotspot

You can pass custom data when a hotspot is clicked - ideal for triggering API calls or tracking user interactions from the host page.

To trigger a custom event:

  1. Select a hotspot in the node editor. (Need a reminder on how to open the node editor? See Add hotspots to interactive videos.)
  2. The Properties panel opens.
  3. Under the Behavior section, enter the custom data you want to pass in the Custom data field.

When the hotspot is clicked during playback, the custom data is passed through the API event.

Add custom data with the API Timeline

The API Timeline lets you insert custom events at specific points during playback, without needing a user to click. Each cue point acts as a timed trigger and can pass custom data, enabling targeted actions or tracking.

To add custom data using the API Timeline:

  1. In the node editor, click the API Timeline toggle. (Need a reminder on how to open the node editor? See Add hotspots to interactive videos.)
  2. Add a new cue point at the time you want the event to occur.
  3. In the custom data field, enter the information you want to pass.
  4. Unlike hotspot events, API Timeline events can be placed anywhere in the video, giving you full control over when data is triggered.

By combining hotspot-triggered events and API Timeline events, you can customize and track your interactive video experience in a flexible way.

Was this article helpful?
Thank you for your feedback!
User Icon

Thank you! Your comment has been submitted.

In this article
Related articles
Back to top

Never miss a thing!

Subscribe to our customer newsletter and our release notes updates, so you always get the best out of Kaltura.
Newsletter