Freshpaint Web SDK Reference

Tracking Methods

track

The track call can be used to manually send data to your destinations. See the docs on manually tracking events in Freshpaint for more information.

freshpaint.track("Purchase", {"price": 500});
ArgumentTypeRequiredDescription

Event Name

String

Yes

The name of the event you want to send to Freshpaint.

Properties

Object

No

A JSON object of properties you want to send along with the event.

options

Object

No

callback

Function

No

A function that will be called after the track call completes.

identify

The identify call can used to attach user properties the current user. Destinations will then use that data to create a single profile for that user, even if data for that user comes from multiple places. See the identify docs for more information.

// Associate all future events sent from
// the library with the distinct_id ada.lovelace@example.com
freshpaint.identify("ada.lovelace@example.com", {
 "email": "ada.lovelace@example.com",
 "name": "Ada Lovelace"
});

The properties argument is optional. If you want to only attach a unique identifier to the user, you can call identify like so:

freshpaint.identify("ada.lovelace@example.com");

Likewise, the identifier is also optional. If you only want to attach properties to the user without attaching an identifier, you can perform a call like the following:

freshpaint.identify({
 "email": "ada.lovelace@example.com",
 "name": "Ada Lovelace"
});
ArgumentTypeRequiredDescription

distinct_id

String

No

A string that uniquely identifies a user (such as email address).

properties

Object

No

A JSON object of user properties to send to the destinations.

options

Object

No

callback

Function

No

A function that will be called after the identify call completes.

group

The group call can be used to attach group properties to the current user. Destinations will then allow you to analyze different groups of users.

freshpaint.group("Google", {
  "plan": "enterprise",
  "sign-up-date": "04/01/2019"
});
ArgumentTypeRequiredDescription

distinct_id

String

Yes

A string that uniquely identifies the group this user belongs to (such as a company name).

properties

Object

No

A JSON object of group properties to send to the destinations.

options

Object

No

callback

Function

No

A function that will be called after the group call completes.

alias

The alias call can be used to specify one user id as an alias for another user id. This is needed to implement the identify for some destinations, specifically Mixpanel and Kissmetrics.

  • Mixpanel has an Organization setting to control identity merging that you can read more about here. If it is disabled, you will need to call alias explicitly.

  • Kissmetrics requires an explicit call to alias only in certain circumstances that you can read about here.

freshpaint.alias("ada.lovelace@example.com");
ArgumentTypeRequiredDescription

new_id

String

Yes

The new id to alias the old id to.

old_id

String

No

The old id to alias to the new id. Defaults to the id of the current user.

options

Object

No

callback

Function

No

A function that will be called after the alias call completes.

page

  • page is not generally necessary or useful for you to call directly - the Freshpaint snippet has a page call which ensures pageviews are collected out of the box, even for single page applications. There are only a few destinations where every page call will result in something being delivered, including Amplitude and June, as called out in "Destination Info" in the documentation.

The SDK page call will only trigger a pageview for client-side destinations. Server-side page views are automatically tracked, please visit the destination specific documentation for more information.

The page will trigger a virtual pageview in your downstream destinations. If you have some notion of a page view that does not match the automatic pageview tracking, you should set up a custom event by using freshpaint.track() instead.

ArgumentTypeRequiredDescription

category

String

No

The category this page belongs to (such as a marketing page or product page).

name

string

No

The name of this specific page.

properties

Object

No

A JSON object of properties to send to the destintions.

options

Object

No

callback

Function

No

A function that will be called after the page call completes.

Utility Methods

ready

The ready call will call the provided callback after the Freshpaint SDK and the SDK for all destinations has finished loading.

freshpaint.ready(function() { console.log("The Freshpaint SDK has loaded"); });
ArgumentTypeRequiredDescription

callback

Function

Yes

The function to call once the Freshpaint SDK has completely loaded

reset

The reset call clears any local Freshpaint data attached to this user. This does not clear any local data for any of your destinations. For example this may be useful if a user logs out and logs in to a different account.

freshpaint.reset();

addEventProperties

The addEventProperties call can be used to set data layer properties. Once a property is set through addEventProperties all events going forward will contain that property. The call

freshpaint.addEventProperties({"pricing plan": "enterprise"});

will include the property pricing plan with the value enterprise until either the value is overwritten or you delete the property with removeEventProperty. addEventProperties should be used to set any properties that can change.

If you need to add properties to a pageview event using addEventProperties, you must use custom pageviews for destinations that support them. Refer to the destination specific documentation for more information.

ArgumentTypeRequiredDescription

properties

Object

Yes

An object of properties and values to attach to all events going forward.

addPageviewProperties

The addPageviewProperties call creates data layer properties that persist until the user leaves the page. The properties created with addPageviewProperties are automatically removed once the user leaves the current page. The call:

freshpaint.addPageviewProperties({"product name": "pair of shoes"});

will send the property product name with the value pair of shoes as part of all events that occur on the current page. Once the user leaves the current page, the property will no longer be sent. The addPageviewProperties call should be used to set any properties that are specific to the page the user is currently on.

If you need to add properties to a pageview event using addPageviewProperties, you must use custom pageviews for destinations that support them. Refer to the destination specific documentation for more information.

ArgumentTypeRequiredDescription

properties

Object

Yes

An object of properties and values to attach to all events that occur on the current page.

addInitialEventProperties

The addInitialEventProperties call works the same way as addEventProperties except if a property is already set, addInitialEventProperties will not override it. This is useful for when you care about the first value of some property. As an example, the call

freshpaint.addInitialEventProperties({"initial landing page": "/article"});

will set the value of the property initial landing page to /article. Even after calling addInitialEventProperties with a different of initial landing page the value of initial landing page will still be /article. addInitialEventProperties should be used to set properties that you never want to change.

If you need to add properties to a pageview event using addInitialEventProperties, you must use custom pageviews for destinations that support them. Refer to the destination specific documentation for more information.

ArgumentTypeRequiredDescription

properties

Object

Yes

An object of properties and values to attach to all events going forward.

removeEventProperty

The removeEventProperty call can be used to remove data layer properties. Once used, freshpaint will no longer send the given property. As an example, the call:

freshpaint.removeEventProperty('search term');

will delete the current search term property and Freshpaint will stop sending it going forward.

ArgumentTypeRequiredDescription

property

String

Yes

The name of the property to remove.

Using the Integrations Object

You can pass in an integrations object in for each of the tracking methods (track, identify, etc.) to specify which destinations to send a precision-tracked event.

For example, the following sends the identify call to only Mixpanel and Braze:

Please note that for freshpaint.identify calls, the integrations object is not nested within the $options object.

freshpaint.identify('user_123', {
  email: "ada.lovelace@example.com",
  name: "Ada Lovelace"
}, {
  integrations: {
    'All': false,
    'Mixpanel': true,
    'Braze': true
  }
});

This example sends a track call to only Mixpanel and Braze:

Please note that for freshpaint.track calls, the integrations object is nested within the $options object.

freshpaint.track(
  "some-event-name",
  {
    "some_property": 123,
    "$options": {
      integrations: {
        All: false,
        Mixpanel: true,
        Iterable: true
      }
    } 
  }
);

All: false tells Freshpaint to not send the message to any destinations unless the destination is explicitly set to true.

You can also use the integration objects to specify which destinations a message should not be sent to. This example will send the identify message to all destinations except Mixpanel and Braze:

freshpaint.identify('user_123', {
  email: "ada.lovelace@example.com",
  name: "Ada Lovelace"
}, {
  integrations: {
    'Mixpanel': false,
    'Braze': false
  }
});

If you have multiple configured instances of a given destination type, you can choose a specific one with a suffix, such as: Facebook Conversions API::0123456789012345. The configuration page for the instance shows the full value to use. When no suffix is specified, all configured instances of the destination type are selected for inclusion / exclusion.

Note that for messages triggered by freshpaint.track(), you can specify which destinations an event should be sent to without code. To do this, find the event in the Freshpaint UI and enable "override hardcoded destinations" in "Event Destinations: Settings", then toggle the destinations of interest.

Enabling "override hardcoded destination" in the UI will take precedence over the configuration specified in the integrations object.

Enabling 'override hardcoded destination' in the UI is not compatible with events sent from the Freshpaint Google Tag Manager Integration.

Typescript declaration file

If you are using the Freshpaint SDK within a typescript application, you can include the following type declaration file

Troubleshooting

  • If you are having trouble accessing the Freshpaint SDK, please ensure you are calling freshpaint.identify() instead of window.freshpaint.identify()

Last updated