HomeLogin

Installing the Freshpaint Javascript SDK

Installing the Freshpaint Javascript SDK to the production website has to be done by an engineer. It usually takes about five minutes to install. For deploying to production you should invite a technical teammate to your account and have them install Freshpaint. Once installed (either locally or on production), a non-technical user can use Autotrack within the Web source to control and manage data without assistance from a technical user.

Installing the Freshpaint SDK Directly Onto Your Site

To install Freshpaint, go to the sources page in Freshpaint:

From the sources page click on configure next to the Web source. This will pull up the code for the Freshpaint SDK:

Copy the snippet into the <head> of your site. That's it!

If your application uses Next.js, you will need to add an id attribute to the script tag of the Autotrack snippet, such as <script type="text/javascript" id="freshpaint-script">.

Installing the Freshpaint SDK via Google Tag Manager (GTM)

  1. In your GTM Workspace, create a new tag using the Custom HTML tag type.

  2. Next, copy and paste the snippet in the HTML field and set the firing trigger to Initialization - All Pages.

  3. Save and test, using GTM's Preview Mode

Installing the Freshpaint SDK via Adobe Launch

  1. Create a new rule, and name the rule according to your existing rule naming convention, if any. Ex: "Freshpaint SDK - Production"

  2. Add an event

    1. Extension: Core

    2. Event Type: Library Loaded (Page Top)

    3. Add additional conditions if you do not want the Freshpaint SDK to fire on all

      pages/URLs. For example, ensuring the HTML code only fires for its intended

      environment

  3. Add an action

    1. Extension: Core

    2. Action Type: Custom Code

    3. Language: HTML

    4. Code: add your Freshpaint SDK snippet

  4. Save and test

    1. Save the library and build it in the environment you use for testing

    2. Confirm Freshpaint is firing by opening the Console of your browser’s developer tools and typing freshpaint. Check that the object returns an array similar to the screenshot below:

Verifying the Installation

To verify that Freshpaint is installed correctly, navigate to the Freshpaint Live View. Live View will now provide a live feed of every user action performed on your site. If you navigate to your site in another tab and click around, you should see the actions you're performing show up in the liveview:

Once you see data coming through, you have successfully installed Freshpaint.

Once you have the Web source installed on your site, Autotrack will automatically be implemented. You will also have access to Precision Tracking if you choose to manually track your events.

User Identification

Once you have confirmed that Freshpaint is successfully installed, you should identify your users. This is how you send information to Freshpaint and your destinations about who your users are.

PreviousAdd Autotrack to your website to collect data from your usersNextInstalling the Freshpaint SDK with a Content Security Policy (CSP)

Last updated

Was this helpful?