Going further

Dynamic Properties

Modern visual event taggers like Freshpaint enable you to send metadata along with click events. In our example application, there’s a form that has a dropdown selector and a submit button:

The Freshpaint event editor lets you add dynamic properties to your data; in this particular case, a “get a demo” event would be much more useful if we also sent the industry the user had selected when they pressed the button.

Freshpaint uses CSS selectors which allow you to target any element on your page to be included with the event data. Because our <select> element has an ID of industry:

We might implement the industry property like this:

And then we’ll get the user-selected industry in our event data:

If you have trouble with CSS selectors, your browser’s dev tools might be able to help! For example in Chrome, if you “inspect element” on the dropdown, you can “copy selector” which will put the CSS selector for any element on your page onto your clipboard.

Identity Management

One of the things the visual tagger can’t do is identify a logged in user in your application. While a full implementation of identity management is beyond the scope of this article, there are generally two places where a developer should instrument an analytics tag to identify the current user:

● when a user signs up
● when a user signs in

The code to announce a user’s identity is simple:

freshpaint.identify('[email protected]')

More information on Freshpaint’s identity management can be found here.

When you implement identity management in Freshpaint, you get Mixpanel user profiles for free!

Proper identity management is critical. When you add this code to your website, you’ll want to triple-check that each user has their own unique event stream that persists across sessions. You can also do this from Freshpaint’s Live View.

Freshpaint wraps Mixpanel

For those with some experience writing code, it’s important to remember that the Freshpaint SDK bundles the Mixpanel JS SDK.

This means that when you add Freshpaint to your application, and add Mixpanel as a destination, the mixpanel object in the browser is also available as a global:

Ultimately, this means that you won’t lose any new functionality that we (Mixpanel) may add to our SDK in the future.


Did this page help you?