Sending custom page data to Fullstory

With the Set Page Properties API, you can send your own custom page names and properties to Fullstory. This allows you to:

• Search for events using your own page properties instead of URLs 
• Display custom page properties in metrics, funnels, and dashboards
• Align page properties in Fullstory with other systems, like your CDP or Tealium

Using Custom Page Data in Fullstory

After you send custom page data to Fullstory, you can search for events that happen on a page using dependent criteria.

To control which properties are visible in Search, Admin or Architect users can archive custom page fields under Settings > Data Management > Properties.

Frequently Asked Questions

Are there other ways to pass custom page data to Fullstory?

Yes. The Fullstory API is one way to pass custom page data to Fullstory. You can also send custom page data using Data Layer Capture or an out-of-the-box integration with a CDP like Tealium.

Will custom page data be visible in Page Insights?

Yes, Pages set via the API will show up in Page Insights just like Pages defined within Settings > Data Management > Pages.

Can I use the Set Page Properties API with Single Page Applications (SPAs)?

The Set Page Properties API has limitations when used with Single Page Applications (SPAs), particularly those using hash-based routing or that don't change the URL host/path during navigation.

Fullstory only recognizes a new "page" when there is a change to the URL host/path or when a full page load occurs. In an SPA, the page technically never closes—the application just dynamically loads more content into the same page. This means if you try to send multiple different pageName values on the same page, only the first one will be accepted. Subsequent attempts to change the pageName will be rejected and trigger a pageNameChanged error, which you can see under Settings > Integrations > API Errors.

Workaround for SPAs:

Instead of trying to change the pageName as users navigate through your SPA, use a single static pageName for the entire application, and add a dynamic page property that updates with each navigation. For example:

First view:

FS('setProperties', {
  type: 'page',
  properties: {
    pageName: 'MyApp',
    pageStep: 'Checkout'
  }
});

After navigation within the SPA:

FS('setProperties', {
  type: 'page',
  properties: {
    pageName: 'MyApp',
    pageStep: 'Order Confirmation'
  }
});

This approach allows you to track user flow through your SPA using the pageStep property (or any custom property name you choose) while avoiding the pageNameChanged error.

Alternative approach:

For more complex SPA tracking needs, consider using custom events instead of page properties to track navigation and user flow through your application.

For more information about API errors, see Troubleshooting Client API errors.