Understanding how visitors interact with your embedded Horizon experience is key to optimizing performance, engagement and conversions.
And Horizon already has built-in statistics:
But if you want to...
track something that isn't covered by our statistics,
or want to directly compare with other pages you're tracking,
... then you can track custom events in Horizon using the Horizon API.
This article explains:
Tracking custom events in Horizon
Because your Horizon leaflet is embedded directly on your website, views are tracked just like for any other page on your site.
Simply ensure that your tracking software (such as Google Analytics, Matomo, or Adobe Analytics) is active on the page where Horizon is embedded.
Tracking specific actions in your Horizon leaflet can be tracked by Horizon exposing page information through the Horizon API.
The Horizon API
The Horizon API allows you to capture detailed user behavior - such as clicks, navigation, and much more - and send that data to your preferred analytics tools.
By subscribing to these events, you can gain deeper insights into how users interact with your Horizon content and link those insights with other visitor data across your site.
Which events can be tracked?
The Horizon API provides a range of events, like clicks and navigation behaviors. These events can be captured and pushed to your data platform.
For a full list of available events and implementation examples, see our technical documentation:
How to subscribe to Horizon events
To begin capture and track Horizon events, follow these general steps:
Ensure the Horizon embed is initialized correctly on your webpage.
Use the Horizon API to subscribe to the events you want to track.
Forward the event data to your analytics platform or data layer.
Example:
api.offer.subscribe((offerEvent) => {
if (offerEvent.action === 'click'){
const offerData = offerEvent.value;
// your code to push the clicked CTA to your statistics
// your current code to push the product to the basket, generate a modal, etc (in this case just log the data)
console.log(offerData)
}
});This code listens for the click event and logs the data, which you can then forward to your analytics platform.
Next steps
Start by identifying the key actions you want to track from Horizon, and use the API to capture those events.
Need help setting up event tracking or integrating with your platform? Reach out to our support team in the chat in the Horizon admin, or, alternatively, to support@ipaper.io. We’ll be happy to guide you.