Components of the install script

Last updated:

Implementing Pendo directly into your application involves the following key components:

  • The Pendo agent, which is typically hosted on the server (Pendo) side. This is what delivers Pendo.
  • The install script that you add to your application (client side) code. The install script consists of:

This article summarizes these components and provides a brief technical overview of how they work. For guidance on the overall steps for implementing Pendo, from choosing IDs and metadata to adding users and getting started with Pendo, see Plan your direct Pendo implementation. For instructions on installing and configuring Pendo using the install script, see the Developer's guide to implementing Pendo using the install script.

How it works

The install script integrates the Pendo agent into your application. When the application runs in the browser, the install script calls and loads the Pendo agent, which makes Pendo's functionality available in your application.

Your developers must insert the install script into the page header. All pieces of the install script must be present on every page that you want to collect data from. This includes a call for the Pendo agent, an API key to identify your account, and an initialize method to activate the Pendo agent and define IDs and metadata.

Mobile developers add the SDK to your app, initialize Pendo when your app loads, and identify the visitor when you're ready to collect data and display guides.

After installation and configuration through the install script, it can take up to an hour to receive that data. Most data used for analytics is batch aggregated every hour, and can take up to 15 minutes past the top of the hour to appear in Pendo. 

Pendo agent

Depending on your subscription, the Pendo agent is a JavaScript file (pendo.js) that runs in the browser to:

  • Collect and track visitor events (page loads, feature clicks, and so on).
  • Capture visitor and account metadata.
  • Load guides.
  • Deliver the Feedback module.

The agent is typically configured on Pendo servers and is then requested by the install script on the client side.

Install script ("snippet")

The install script, commonly referred to as “the snippet”, is a short JavaScript function that retrieves and loads the Pendo agent code (pendo.js), allowing you to track usage, collect feedback, and deliver messages and guides. To do this, the install script includes:

  • The request for the Pendo agent.
  • A customer-specific API key that maps the data that the agent collects to the product in your Pendo subscription.
  • The initialize method needed to activate the Pendo agent.

The install script and the initialize method must be present on all pages of your website for the Pendo agent to work, unless your application has child frames that come from the same domain as the top frame. In this case, you can configure the install script to automatically install Pendo on child frames by adding the install script to the top frame of your application. Changes to visitor identity or metadata in any of these frames is then applied to all frames.

The Snippet

Note: The existence of the install script doesn't mean tracking is taking place. The install script must be initialized to start tracking. See Initialize method for more details.

Application (API) key

The install script loads Pendo as a library to make its functions available at the window-level and passes through a 32-digit application (API) key that’s included in the code block.

The API key is pre-populated in the application details of your subscription, and is found on the Install page or in App Settings.

Initialize method

The Pendo agent must be initialized before it can start tracking usage analytics, collecting feedback, and delivering guides. Initialization is a JavaScript function in the Pendo install script, where you:

  • Determine the values you want to pass as the Visitor and Account IDs.
  • Customize the metadata that you provide to Pendo.
  • Create auto-tags for Pendo Feedback. For information, see Auto-tagging in Feedback.

The initialization code block allows you to identify visitors and accounts so that you can segment analytics, target guides using metadata passed in from your application variables (such as from a User object or similar), and auto-tag Feedback requests.

All variables passed into the install script must be defined before pendo.initalize() is run. Pendo doesn't initialize correctly if all of the variables passed to Pendo aren't present at initialization. For more information, see Conditionally Initialize Pendo.

Initialization must run on every window reload after a visitor has authenticated and in every frame (if your site has iframes). If you have a multi-page application, you might need to initialize Pendo on each page (not just the login page) or on your global template, if you have one.

Below is an example of the initialization code block, which you can find on the Install page or in App Settings. You can customize this example to meet the needs of your subscription.

Was this article helpful?
1 out of 2 found this helpful