Recording events
This guide walks you through how to record event data in Prepr.
Introduction
Tracking how customers interact with your content is crucial for gaining insights and optimizing their experience. You can easily track and send events to Prepr, such as views, likes, subscriptions, and custom events, directly from your front end.
If you haven't yet done so, check out the Fundamentals guide for key data collection concepts. Before diving in, make sure you’ve already added the Prepr tracking code to your web app.
Recording predefined events
Prepr recognizes each of the events below and processes them differently according to their purpose.
View
You can use this event type when you want to record when a customer opens a web page or when a customer scrolls to an element in a web page.
If you want to record a view event for an entire page, add the content item meta tag to the HTML in your page to automatically send the View
event to Prepr when the page loads.
If you want to record a view event for a content item embedded in a page, you can send the event using the following javascript function:
prepr('event', 'View', { 'id': "{{CONTENT_ITEM_ID}}" });
See some example code below for when the customer moves their mouse over the footer.
<html>
...
<body>
...
<footer onmouseover="prepr('event', 'View', { 'id': '{{CONTENT_ITEM_ID}}' })">
...
</footer>
</body>
</html>
Replace the {{CONTENT_ITEM_ID}}
with the Content item ID of the footer in this case.
Like
You can use the Like
event to indicate when a customer clicks a link or button to indicate their approval or interest.
Send a like event from your front-end with the following javascript function:
prepr('event', 'Like');
See some example code below for when a customer clicks the Like button.
<html>
...
<body>
...
<button onclick="prepr('event', 'Like')">Like</button>
</body>
</html>
If a Like
event is sent to Prepr more than once, the subsequent events are simply ignored.
If you want to indicate that a customer likes a specific content item in the page, you can send the relevant Content item ID in the event.
prepr('event', 'Like', { 'id': "{{CONTENT_ITEM_ID}}" });
If you don't include a Content Item ID in the send request, the event will be linked to the content item in the content item meta tag you set up earlier.
You can also undo the Like
event by sending a corresponding Unlike
event for the same customer and content item.
prepr('event', 'Unlike');
Bookmark
You can use the Bookmark
event to indicate when a customer clicks a link or button to save a piece of content to view later.
Send a bookmark event from your front-end with the following javascript function:
prepr('event', 'Bookmark');
See some example code below for when the customer clicks the Bookmark button.
<html>
...
<body>
...
<button onclick="prepr('event', 'Bookmark')">Bookmark</button>
</body>
</html>
If a Bookmark
event is sent to Prepr more than once, the subsequent events are simply ignored.
If you want to indicate that a customer likes a specific content item in the page, you can send the relevant Content item ID in the event.
prepr('event', 'Bookmark', { 'id': "{{CONTENT_ITEM_ID}}" });
If you don't include a Content Item ID in the send request, the event will be linked to the content item in the content item meta tag you set up earlier.
You can also remove the Bookmark
event by sending a corresponding Unbookmark
event for the same customer and content item.
prepr('event', 'Unbookmark');
Subscribe
You can use a Subscribe
event to indicate when a customer clicks a link or button to subscribe to a newsletter, content updates, or other recurring content notifications.
Send a subscribe event from your front-end with the following javascript function:
prepr('event', 'Subscribe');
See some example code below for when the customer clicks the Subscribe button.
<html>
...
<body>
...
<button onclick="prepr('event', 'Subscribe')">Subscribe</button>
</body>
</html>
If a Subscribe
event is sent to Prepr more than once, the subsequent events are simply ignored.
If you want to indicate that a customer likes a specific content item in the page, you can send the relevant content item ID in the event.
prepr('event', 'Subscribe', { 'id': "{{CONTENT_ITEM_ID}}" });
If you don't include a Content Item ID in the send request, the event will be linked to the content item in the content item meta tag you set up earlier.
You can also cancel the Subscribe
event by sending a corresponding Unsubscribe
event for the same customer and content item.
prepr('event', 'Unsubscribe');
SignUp
You can use a SignUp
event to track when a customer creates a new account or registers on your web app.
This event is not related to a specific content item, but to a specific customer.
In this case, make sure to add the customer meta tag.
Send a SignUp
event from your front-end with the following javascript function:
prepr('event', 'SignUp');
See some example code below for when the customer clicks the Sign Up button.
<html>
...
<body>
...
<button onclick="prepr('event', 'SignUp')">Sign Up</button>
</body>
</html>
If a SignUp
event is sent to Prepr more than once, the subsequent events are simply ignored.
Unregistered customers are automatically deleted from Prepr after 90 days of inactivity.
The SignUp
event ensures the customers who've signed up will not be deleted.
Recording custom events
You can enhance your A/B tests and adaptive content by setting up custom events in your web app.
For example, if you want to track when a visitor makes a Purchase
or clicks to Start
a video or livestream.
Depending on the purpose of your custom events, these can be recorded in Prepr in different ways:
Define conversion metrics
You can use custom events to set up conversions in your web app to get more valuable metrics for A/B tests or adaptive content. To do this, simply add HTML attributes to your A/B tests or when you set up personalization. By adding these HTML attributes, these custom events are automatically stored in Prepr.
Once done, you can also define customer segments using these custom events.
Define customer segments
If you only want to use custom events to create customer segments, for instance, you can send a Custom event with the event
method.
If you've already used custom events to define conversions, then you don't need to add the below javascript function.
prepr('event', '{{CUSTOM_EVENT_NAME}}');
In the example code below we send a Purchase
event when a customer completes a purchase in the web app.
<html>
...
<body>
...
<button onclick="prepr('event', 'Purchase')">Purchase</button>
</body>
</html>
Naming rules
You can choose any name for the custom event that meets the naming rules below.
- Start the name with a capital letter.
- The name has to be one word. In other words, no spaces.
- Don't include any special characters like %, ˆ, &, etc.
- The name should not start with a number.
Was this article helpful?
We’d love to learn from your feedback