Comment on page
Event Library
The event library is where you manage all the event definitions you have labeled. There are several different things you can do with the event library:
- View, Edit, and Label Events
- Create Dynamic Properties
- Send Events to new Destinations
- Use the Freshpaint Time Machine Backfills and Replay Backfills to Recover Historical Data
There are four parts to an event label:
- The Event Name
- The Event Type
- The URL or CSS Selector
- Any Additional Filters
Event Name
This is the name of the event and how it will show up in destinations. We highly recommend using a consistent naming convention and sticking with it. Please see our FAQ on naming events for more:
Because events in Freshpaint aren't tied to code, you can update the name of the event without needing to update any code.
Event Type
This is the type of the event. Freshpaint supports four main kinds of events:
- Click - A click event is for when a user clicks part of your site.
- Pageview - A pageview event is when a user views a page on your site.
- Form Submission - When a user submits a form on your site.
- Change - When a user changes an input field on your site (Freshpaint captures the fact the field was changed, but does not capture the text the user put in the field).
Freshpaint also supports two additional additional kinds of events:
- Custom (Also known as precision events) - These are events from the precision tracked source. They're frontend events written with tracking code.
- Server - Events that come from the Freshpaint server side source.
For custom and server events, you cannot change the name of the event or add any filters.
URL Path
This is a component of the event definition that ties the event definition to an action on your site.
For pageview events, the event definition is tied to your site based on the URL path. The URL path is the URL without the domain included.
The URL filter uses the same syntax as the event definition filter. This means you can use the
* character to match any number of characters. As an example, you can use the URL pattern /docs/*/page to match the pages /docs/directory1/page and /docs/directory2/page.CSS selectors also tie the event definition to an action on your site.
For click, form submission, and change events, the event definition is tied to your site based on a CSS selector. Here's the full list of the CSS attributes that Freshpaint captures.
If you are creating new events, you should be using the Freshpaint Visual Tagger. It will generate the CSS selector for you.
- .class1.class2
- targets all elements with both class1 and class2 set within its class attribute
- .class1 .class2
- targets all elements with class2 that is a descendant of an element with class1 within its class attribute
- div, p
- targets all <div> elements and <p> elements
- div > p
- targets all <p> elements where the parent is a <div> element
- [class*="example"]
- targets all elements where the class attribute value contains example
- [id*="example"]
- targets all elements where the id attribute value contains example
Comma separated values in the CSS selector event filter act as an "OR" operator. This means the event will fire when any of the conditions are met.
For example, in the following example,
div.[data-component="ScrollLinkItem"],[data-element="ListItem"],[data-source-file="ScrollLinkItem.jsx"]
the event will fire every time an element is clicked with any of those attributes. If you wanted the event to fire when matching on multiple attributes of an element, you would instead use a filter like this:
div[data-component="ScrollLinkItem"][data-element="ListItem"][data-source-file="ScrollLinkItem.jsx"]
Filters let you narrow down the event definition you create. For example, you may limit an event definition to a specific page on your site. Checkout the docs on filters for information on what exactly you can do with them:
Through the event library page, you can also create Dynamic Properties. A Dynamic Property is an additional piece of data attached to an event definition whenever the event fires. Checkout the Dynamic Property section of the setting up properties guide for more information on them:
At the bottom of the events library page you'll see the destinations panel.
This is where you can control what destinations an event definition is sent to. To send or stop sending an event definition to a destination, just flip the toggle.
It takes 2 minutes for the Freshpaint CDN to clear. After toggling a new destination, it can take up to 2 minutes before the destination starts showing up on your website.
When you toggle a destination for an event definition, that will send all events going forward.
If you want to send data from before the event definition was labeled, you can use the Time Machine. Just click the Backfill button next to a destination and that will send every event in Freshpaint that matches the event definition to the destination, regardless of when the event was labeled. Checkout the docs on the Time Machine for more information:
On the top-right, you'll see an Export Events button:\
You can click this button to download a CSV file which will provide you with the following information on all of your existing events:
- Event ID
- Event Name
- Event Type
- Event Destinations
- Event Configuration Criteria (if the event is an Autotrack event)
- Filters
- Dynamic Properties
- Event Created at Timestamp
- Event Updated at Timestamp
Last modified 2mo ago