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
  • Dynamic Properties
  • Data Layer Properties
  • addEventProperties
  • addPageviewProperties
  • addInitialEventProperties
  • removeEventProperty
  • Attaching Properties with Precision Tracking
  • React Native Attribute Autotrack

Was this helpful?

  1. Documentation

Setting up Properties

PreviousConfiguring Property CaptureNextSetting up Your Destinations

Last updated 27 days ago

Was this helpful?

Sometimes you will want to attach data to events that isn't automatically captured by autotrack. There are several ways you can attach properties to events.

You can use the techniques below to capture properties like the search term when a user performs a search, or the price of an item when a user adds it to their shopping card. Here's a table of which methods are supported by which SDKs:

Web
React Native
iOS
Android

YES

no

no

no

YES

YES

no

no

YES

YES

YES

YES

no

YES

no

no

Property values are limited to 255 characters.

Dynamic Properties

Dynamic Properties enable you to collect additional metadata via Freshpaint's Autotrack beyond what's automatically collected by default. Freshpaint's Dynamic Properties can grab any visible data on the page and attach that data to your events.

Dynamic properties do not require code to setup and are the easiest way to add additional data to events.

Examples of what you can collect with Dynamic Properties:

  • Collect Item Price, Item Name, and other data when a product is added to a user's cart

  • Collect search terms entered by your users when they execute a search

To add a dynamic property to an event, click Add Dynamic Property in the event definition dashboard which can be found by click on an individual event definition within the :

Specify the name of the property and a CSS selector that points to the element on the page with the information you want to capture. Whenever the event is triggered, Freshpaint will look up the element with the given CSS selector and attach the text of that element as a property to the event.

You may see read-only JavaScript type properties here, created by Freshpaint support.

JavaScript Dynamic Properties allow you to specify a JavaScript function body to set the property value, with the native event available as input. They also support suppressing delivery for configured destinations on this event, via the SUPPRESS_EVENT value.

Please contact support if you'd like to learn more about this capability.

Dynamic Properties are not retroactive at this time

Data Layer Properties

Data layer properties are properties given to Freshpaint that are then attached to all Freshpaint events. Data layer properties allow you to attach additional, contextual information, to your events.

You can create data layer properties by using the addEventProperties, addPageviewProperties, andaddInitialEventProperties.

addEventProperties

The addEventProperties function call creates a data layer property. That property will now be sent with all events going forward. As an example, you can call addEventProperties as follows:

freshpaint.addEventProperties({"ab test variant": "a"});
Freshpaint.addEventProperties({"ab test variant": "a"});

The ab test variant property will now have the value a until removeEventProperty is called or addEventProperties is called with a new value of ab test variant. When you call addEventProperties with a new value of ab test variant, that value will overwrite the existing value.

addPageviewProperties

The addPageviewProperties call lets you create data layer properties that are sent until the user leaves the current page. Once the user leaves the current page, any properties created with addPageviewProperties will now longer be sent. As an example, the call:

freshpaint.addPageviewProperties({"product name": "diamond ring", "price": 100});

Not supported.

will send the property product name with the value diamond ring and the property price with the value 100 as part of all events that occur on the current page. Once the user leaves the current page, the product name and price properties will no longer be sent. addPageviewProperties should be used for any properties that are specific to the page the user is currently on.

If you call addPageviewProperties you should call it as part of the Freshpaint snippet. Specifically you should call addPageviewProperties immediately after the freshpaint.init() call and before the call to freshpaint.page(). This ensures any pageview properties you set are attached to the pageview event created by Freshpaint.

addInitialEventProperties

The addInitialEventProperties call works like addEventProperties except it will not override a property if that property already has a value. As an example, if you want to attach the initial page a user landed on as a property, you can do that like so:

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

Now if you call addInitialEventProperties again with a different value of initial landing page, the property initial landing page will still be set to /article.

removeEventProperty

To remove a data layer property, you can call the removeEventProperty api method. The call

freshpaint.removeEventProperty("pricing plan");
Freshpaint.removeEventProperty("pricing plan");

will stop sending the property pricing plan going forward.

Attaching Properties with Precision Tracking

If you send an event into Freshpaint with a manual track call, you can pass in a map of properties as the second argument:

freshpaint.track("Purchase", {"price": 500});
Freshpaint.track("Purchase", {"price": 500});
Freshpaint.shared().track(
    "Purchase", 
    properties: ["price": 500]
)
[[FPAnalytics sharedAnalytics]
              track:@"Purchase" 
              properties:@{ @"price": @500 }];
Freshpaint
    .with(getActivity().getApplicationContext())
    .track("Purchase", new Properties().putValue("price", 500));

React Native Attribute Autotrack

For React Native, Freshpaint will automatically capture a whitelist of properties from your React components. For a complete list of properties collected by Freshpaint, see the docs on what information is collected by the React Native SDK. You can also whitelist your own properties. You can use these properties to narrow down event definitions when defining events. For example, Freshpaint captures the title property of React Native buttons, allowing you to define a CSS selector like so:

Button[title="Press Here"]

To whitelist your own properties, attach a freshpaintOptions argument to the component class with the attributes you would like to whitelist or blacklist. For example, if you have a functional component like:

function MyComponent({ arg }) {
  ...
}

You can capture the arg property by adding the following bit of code:

MyComponent.freshpaintOptions = {
  eventProps: {
    include: ['arg'],
  }
};

If you are using a class component, you instead set the freshpaintOptions property of the class like so:

class MyComponent extends Component {
  freshpaintOptions = {
    eventProps: {
      include: ['arg'],
    }
  };
}

JavaScript Dynamic Properties require you to include the unsafe-eval expression.

See the for more information.

See the for more information.

See the for more information.

See the

modify your Content Security Policy
API docs on addEventProperties
docs on addPageviewProperties
API docs on addInitialEventProperties
API docs on freshpaint.track() for more information.
Dynamic Properties
Data Layer Properties
Precision Tracked Properties
React Attribute Autotrack
event library