How do I exclude elements in FullStory?

The privacy of your customer data is a shared responsibility. FullStory diligently ensures that your customer data is securely stored and accessible only to you. In addition, we provide you a tool to easily exclude sensitive customer information.

Important note: Element exclusions are not retroactive. If you are viewing this article after you started recording, there are several options available for deleting sessions from FullStory, if necessary.  

Excluding Elements 

Within Settings you’ll notice an area called Privacy. You can add elements to the Excluded Elements list to block any data from those HTML elements from ever being captured. Excluded data never leaves your customer's browser, meaning FullStory does not receive or process the data in any way. (You can also use Inspect Mode to exclude elements via point & click)

Click "Add Element" to create a new exclusion. Input the CSS selector and (optionally) leave yourself a note to remember why this block rule is important. 

Your note will show up in the exclusions list:

You’ll also notice the “Record with user consent” checkbox. When used together with the FS.consent API, this setting allows you to record this element only after a user has given explicit consent (these are known as “consent-required elements”).

Alternative options

Alternatively, you can make an element impossible to record no matter what by using .fs-block.

Just add the .fs-block class name to any element you want to exclude. 

<input class="ccnum fs-block">

This works in the exact same way as configuring an exclusion in the settings page, but lets you do it directly in your own code/html. That means the exclusion includes any child elements, so you can do things like this:

  <form class="fs-block" id="payment">
    <input class="ccnum">
    <!-- etc -->

Under certain circumstances, .fs-hide doesn't behave exactly the same way as .fs-block or adding an element's selector to the excluded elements list directly. An element with the .fs-hide class will be invisible at playback. Excluded elements added directly or by class name .fs-block are visible as a gray box with cross-hatches as shown below.

Are there any elements that are default exclusions?

We pre-populate the exclusions list with industry standard HTML. You'll want to double check how your company has coded these sensitive fields. If your input fields have different CSS naming conventions, you'll need to add them to the exclusions list.

If you're using the industry standards, we'll block the following default exclusions:

  • Passwords with input[type=password]
  • All credit card data with [autocomplete^=cc-]
    • Name
    • Credit card number
    • Expiration date
    • Security code
    • Card type 
  • Hidden inputs with input[type=hidden]

You can find the exclusions list by clicking on Settings > Privacy.

A few details about Excluded Elements

  • When you encounter a field that’s been excluded while viewing a recording, you’ll see a gray box with cross-hatches over the field indicating it’s blocked, like in the image above.
  • No changes need to be made in your app to block inputs in sensitive fields – just identify them in FullStory and they’ll be blocked from the system.
  • Only the inner contents and some attributes (value, checked, src, data, alt) of excluded elements will be excluded. Any HTML attributes—except those listed above—of the excluded elements will still be recorded (though they won't be visible in the FullStory UI during playback). Take for example the following:

    <div class="fs-hide" data-secret="abracadabra">Your secret is abracadabra</div>

    In this example, the text Your secret is abracadabra will not be recorded. However, the text <div class="fs-hide" data-secret="abracadabra"> will be recorded.

    If you are storing sensitive data within HTML element attributes, you'll need to exclude the parent of the element to be excluded. (Note that there is not a way in pure CSS to specify the parent node of a selector).

How do I use Inspect Mode to exclude elements from being recorded? 

Account admins can use Inspect Mode to easily identify text fields and other areas where customers will enter sensitive information, so that those elements will never be recorded by FullStory.

Using the Inspect Mode feature, find the element within your page, then click Exclude Element. The CSS selector you chose will automatically be added to your excluded elements list. 

Image title

How exactly does excluding elements work? What are the technical details?

FullStory records the user interface (UI). The only method FullStory uses for recording the UI is by tracking the DOM structure and any changes to it. This means:

  • FullStory never records or runs scripts, XHR/Ajax requests, or anything in the Javascript VM's heap.
  • The recording script sends changes to the DOM structure to FullStory's servers, along with raw input events and metadata.

Element exclusion, therefore, operates at the DOM level. This means:

  • Excluded elements never touch FullStory's servers. 
  • All excluded elements are processed locally in the user's browser. When changes to the DOM structure are sent to FullStory's servers, excluded elements are left out.
  • Relatedly, some raw input events (e.g., key and click events) are also redacted when they relate to an excluded element.

If you have any additional questions, feel free to reach out to

Can’t find what you’re looking for?

The FullStory team awaits your every question.

Contact Us