Freshpaint
HomeLogin
  • Documentation
    • What is Freshpaint?
    • ⚕️HIPAA Mode
    • 🏗️Building Out Your Account
    • 🌐Overview of Features
    • Guides
      • 📡Add Autotrack to your website to collect data from your users
        • Installing the Freshpaint Javascript SDK
        • Installing the Freshpaint SDK with a Content Security Policy (CSP)
        • Installing the Freshpaint Javascript SDK with Server-Side Rendering (SSR) + React
        • Autocapture + React
        • Configuring a Destination
        • Labeling User Actions
        • How do I install Freshpaint with Typescript?
      • 🔁Send historical data to any destination with Time Machine
      • Next.js Quickstart Guide
      • Android Quickstart Guide
        • Installing the Freshpaint Android SDK
        • Configuring a Destination
        • Instrumenting Your App
      • iOS Quickstart Guide
        • Installing the Freshpaint iOS SDK
        • Configuring a Destination
        • Instrumenting Your App
      • React Native Quickstart Guide
        • Installing the Freshpaint React Native SDK
        • Configuring a Destination
        • Labeling User Actions
        • Configuring Property Capture
    • Setting up Properties
    • Setting up Your Destinations
      • Enabling and Disabling a Destination
      • Deleting a Destination
    • Setting up Your Events
    • User Identification
      • Designated Identify Properties
    • Maps
    • Analytics (Beta)
      • Web Analytics Dashboard
      • Campaigns
      • Service Lines
      • Data Glossary
    • Translations
    • Web Tracker Monitoring
      • Tracker Resolution Types
      • Historical Scans
  • Integrations
    • Destinations
      • Demand Side Platforms (DSPs)
        • Basis
          • Basis Quick Start Guide
          • Basis Reference
        • Google Campaign Manager 360
        • StackAdapt
          • StackAdapt Quick Start Guide
          • StackAdapt Reference
        • theTradeDesk
          • theTradeDesk Quick Start Guide
          • theTradeDesk Reference
          • theTradeDesk with CM360 Configuration Guide
        • Viant
          • Viant Quick Start Guide
          • Viant Reference
      • Direct Response Ads
        • Facebook Conversions API
          • Facebook Conversions API Quick Start Guide
          • Facebook Conversions API Reference
        • Google Ads Conversion API
          • Google Ads Conversion API Quick Start Guide
          • Google Ads Conversions API Reference
        • Google Ads
          • Google Ads Quick Start Guide
          • Google Ads Reference
        • LinkedIn Ads
          • LinkedIn Ads Quick Start Guide
          • LinkedIn Ads Reference
        • Microsoft Ads (formerly Bing Ads)
          • Microsoft Ads Quick Start Guide
          • Microsoft Ads Reference
          • Microsoft Ads Multi-Config Reference
        • Pinterest Ads (Beta)
          • Pinterest Ads Quick Start Guide
          • Pinterest Ads Reference
        • Pinterest Tag
        • Reddit Ads
          • Reddit Ads Quick Start Guide
          • Reddit Ads Reference
        • TikTok Ads
        • Twitter Ads
      • Data Activation
        • ActiveCampaign
          • ActiveCampaign Quick Start Guide
          • ActiveCampaign Reference
        • Amplitude
          • Amplitude Quick Start Guide
          • Amplitude Reference
        • Braze (formerly Appboy)
          • Braze Quick Start Guide
          • Braze Reference
        • Customer.io
          • Customer.io Quick Start Guide
          • Customer.io Reference
        • Freshsales
        • Google Analytics 4 Proxy
          • Google Analytics 4 Proxy Quick Start Guide
          • Google Analytics 4 Proxy Reference
          • Google Analytics 4 Proxy Advanced Tracking Configurations
        • Google Analytics 4 Server-Side
          • Google Analytics 4 Server-Side Quick Start Guide
          • Google Analytics 4 Server-Side Reference
        • Heap
        • Hotjar
        • HubSpot Cloud
        • HubSpot Web
        • impact.com
          • Impact.com Quick Start Guide
          • Impact.com Reference
        • Intercom
          • Intercom Quick Start Guide
          • Intercom Reference
        • Iterable
          • Iterable Quick Start Guide
          • Iterable Reference
        • June
        • Klaviyo
        • Mixpanel
          • Mixpanel Quick Start Guide
          • Mixpanel Reference
        • OneSignal
          • OneSignal Quick Start Guide
          • OneSignal Reference
        • Podscribe (Early Access)
        • Sendinblue
        • Sentry
        • Vero Cloud
        • Webengage
        • Webhooks
        • Woopra
        • Zendesk
      • Data Warehouses
        • Azure Warehouse Setup
        • BigQuery Warehouse Setup
        • Databricks Warehouse Setup
        • Postgres Warehouse Setup
        • Redshift Warehouse Setup
        • S3 Warehouse Setup
        • Snowflake Warehouse Setup
      • Consent Management
        • Osano
        • OneTrust
        • Custom Consent Manager
    • Sources
      • Web
        • Autotrack
        • Precision Tracking
      • CallRail
      • Invoca
      • Customer.io
      • Intercom
      • Mailchimp
      • React Native
      • SendGrid
      • Sendinblue
      • Server-Side
      • iOS
    • 🔷Google Tag Manager integration
      • Google Tag Manager migration
      • Quick Start Guide
    • 📺Freshpaint Video Platform
    • 🖼️Impression Pixel
  • Admin Panel
    • Event Library
      • Event Library Bulk Actions
      • Event Definition Filters
      • Event Tester
      • 🔁Time Machine
      • Visual Tagger
      • Advanced Options
        • Tag Manager
        • Disabling Target Text Capture
        • Cross Domain Tracking
    • Projects & Environments
    • Teams
      • Role-Based Access Control (RBAC)
    • Transformations
      • Standard Events
      • Modify Data
      • Modify User Data
      • SQL Transformations
    • 📈Destination Monitoring
    • 🔎Investigate: Testing and Debugging
      • Live View
      • Event Verification
  • Reference
    • Developer Docs
      • Freshpaint Web SDK Reference
      • Freshpaint Web SDK Options
      • Freshpaint React Native SDK Reference
      • Freshpaint iOS SDK Reference
      • Freshpaint Android SDK Reference
      • HTTP API
    • Frequently Asked Questions
      • How do I circumvent ad blockers?
      • Can Freshpaint track users across domains?
      • Can I install Freshpaint on a Chrome extension?
      • What properties are captured with my events?
      • How Do I Switchover From Segment?
      • How Do I Switch From Native Google Analytics to the Freshpaint Google Analytics Destination?
      • Where do I find my Environment ID?
      • Is Freshpaint GDPR & CCPA Compliant?
      • Can I use transformations to anonymize data for client-side destinations?
      • How do I QA or debug my data?
      • Why Do My Numbers Differ Across Different Tools?
      • Billing: How Does Freshpaint Determine MTUs?
      • Can I Use Freshpaint on Multiple Sites?
      • How Can I Export Data From Freshpaint?
      • How Does Freshpaint Identify Users?
      • How Many Events Should I Create?
      • What Should I Name My Events?
      • How do I track scroll depth?
      • What Data Does Freshpaint Collect?
        • Data Collected on Web
        • Data Collected on React Native
      • Does Freshpaint's Autotrack slow my site down?
      • Running Freshpaint with a Proxy
      • Should my Environment ID be treated as a sensitive key?
      • How Does Freshpaint Determine Session Count?
      • What is the difference between client-side and server-side connection mode?
      • What is a Proxy Integration?
      • Where can I view Freshpaint’s Status?
      • Does Freshpaint provide HIPAA audit logs?
      • Freshpaint Cookie Too Large
      • How does Freshpaint compare to server-side Google Tag Manager?
      • If a user re-installs my app, will Freshpaint generate a new device ID?
      • Why doesn't Freshpaint need a BAA before sending data to Google Ads and Facebook Ads?
      • What Implementation Services Does Freshpaint Offer?
      • Single Sign On (SSO) Setup
Powered by GitBook
On this page
  • Tracking Methods
  • track
  • identify
  • group
  • alias
  • page
  • Utility Methods
  • ready
  • reset
  • addEventProperties
  • addPageviewProperties
  • addInitialEventProperties
  • removeEventProperty
  • Using the Integrations Object
  • Typescript declaration file
  • Troubleshooting

Was this helpful?

  1. Reference
  2. Developer Docs

Freshpaint Web SDK Reference

PreviousDeveloper DocsNextFreshpaint Web SDK Options

Last updated 3 months ago

Was this helpful?

Tracking Methods

track

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

freshpaint.track("Purchase", {"price": 500});
Argument
Type
Required
Description

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 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"
});

Note that if options and/or callback are passed, they must be the third and fourth arguments respectively. Use undefinedfor parameters where you don't need to pass a value.

// Correct identify calls, passing undefined for optional parameters
freshpaint.identify("ada.lovelace@example.com", undefined, options)
freshpaint.identify("ada.lovelace@example.com", undefined, undefined, callback)
freshpaint.identify(undefined, properties, options, callback)

// The following calls are incorrect because options 
// must be passed as the third parameter
freshpaint.identify("ada.lovelace@example.com", options)
freshpaint.identify(properties, options)
Argument
Type
Required
Description

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"
});

Note that if options and/or callback are passed, they must be the third and fourth arguments respectively. Use undefinedfor parameters where you don't need to pass a value.

Argument
Type
Required
Description

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.

freshpaint.alias("ada.lovelace@example.com");
Argument
Type
Required
Description

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.

Argument
Type
Required
Description

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"); });
Argument
Type
Required
Description

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.

Argument
Type
Required
Description

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.

Argument
Type
Required
Description

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.

Argument
Type
Required
Description

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.

Argument
Type
Required
Description

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
  }
});

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.

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()

This is an advanced feature. Options is a JSON object that can be used to configure what data is sent to what destinations. See the docs on .

This is an advanced feature. Options is a JSON object that can be used to configure what data is sent to what destinations. See the docs on .

This is an advanced feature. Options is a JSON object that can be used to configure what data is sent to what destinations. See the docs on .

Mixpanel has an Organization setting to control identity merging that you can read more about . 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 .

This is an advanced feature. Options is a JSON object that can be used to configure what data is sent to what destinations. See the docs on .

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 instead.

This is an advanced feature. Options is a JSON object that can be used to configure what data is sent to what destinations. See the docs on .

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 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.

Enabling 'override hardcoded destination' in the UI is not compatible with events sent from the .

manually tracking events in Freshpaint
identify docs
here
here
freshpaint.track()
configuration page
Freshpaint Google Tag Manager Integration
Passing in Options to the Freshpaint SDK
Passing in Options to the Freshpaint SDK
Passing in Options to the Freshpaint SDK
Passing in Options to the Freshpaint SDK
Passing in Options to the Freshpaint SDK
1KB
index.d.ts