Knowledge base | mouseflow

Exclude or Replace Content on Pages

You can exclude/replace certain parts of the page source from appearing in playback or in heatmaps.

This is critical for excluding Personal Data from being recorded. Personal data means any data that could potentially identify a specific individual. Any information that can be used to distinguish one person from another and can be used for de-anonymizing anonymous data can be considered Personal Data.

This includes:
- Names and adresses
- Email Adresses
- Financial Information (PIFI)
- Unique Identifiers (like passport or social security numbers)
- Medical information

Note that this list is not exhaustive. You can find more information here.

The Visual Privacy Tool

Once you've identified the content, you can start excluding it. This is easy to do using our Visual Privacy Tool. With this tool, you can simply point and click on the elements you want to exclude (or whitelist). To open the Visual Privacy Tool, navigate to the 'Settings'-page for the website in question. Here you'll find the tab 'Exclude and Whitelist':

Clicking the 'Open Visual Privacy Tool'-button will allow you to open the tool on any page you want. You can then proceed to select the elements you wish to exclude.

Other Methods

You have two additional options for excluding content on your website from being recorded - one requires editing the code of your website while the other can be done directly via the user interface.

Method #1: User Interface

You can exclude content directly from the website settings page by using the "Exclude Content" field. The full procedure is described here.

Method #2: Code

You can use our "data-mf-replace" HTML attribute on an individual element to remove it from the HTML (before it's sent to our platform).

Here's an example:

<div>
    <p>Before</p>
    <p data-mf-replace="">
        Content to Exclude
    </p>
    <p>After</p>
</div>

In playback, this HTML code would be shown like this:

<div>
    <p>Before</p>
    <p>After</p>
</div>

Note how the inner content (which we blocked) is no longer present.

It's also possible to exclude only the inner part of an element, using the HTML attribute "data-mf-replace-inner" instead:

<div>
    <p>Before</p>
    <p data-mf-replace-inner="">
        Content to Exclude
    </p>
    <p>After</p>
</div>

In this case, the result would be:

<div>
    <p>Before</p>
    <p></p>
    <p>After</p>
</div>

Replacing Content

In the examples above, we removed content but didn't replace it with any kind of placeholder. You may want to replace it with something else to indicate that there was originally a value shown. To do this, you can add a value to the "data-mf-replace" HTML attribute.

Here's an example:

<div>
    <p>Before</p>
    <p data-mf-replace="**REMOVED**">
        Content to Exclude
    </p>
    <p>After</p>
</div>

In playback, this HTML code would be shown like this:

<div>
    <p>Before</p>
    **REMOVED**
    <p>After</p>
</div>

Again, it's also possible to replace only the inner part of an element:

<div>
    <p>Before</p>
    <p data-mf-replace-inner="**REMOVED**">
        Content to Exclude
    </p>
    <p>After</p>
</div>

In this case, the result would be:

<div>
    <p>Before</p>
    <p>**REMOVED**</p>
    <p>After</p>
</div>