How to Manually Suppress Specific Elements and Images

You may want Hotjar to not collect data from certain fields and elements. When doing so, Hotjar does not collect the data and instead sends asterisks "***", 1s "111" or a pattern for each character/element.

• Specific Element Suppression
• Image Suppression
• On-Page Text Suppression
• Verifying Recording Suppression

---

Specific Element Suppression

You can suppress individual elements, input fields and regular text by making a small modification to your site code by adding an attribute data-hj-suppress to the elements you wish to suppress.

<!-- The below will suppress any characters typed in the field-->
<input type="text" name="company" data-hj-suppress />

<!-- The below will suppress any characters typed in the field-->
<textarea name="comments" data-hj-suppress></textarea>

<!-- The below will suppress any characters displayed in the paragraph-->
<p data-hj-suppress>Suppress me</p>

<!-- The below will suppress any characters displayed in any of the child elements inside the span element-->
<span data-hj-suppress>
  <p>Suppress this</p>
  <p>and this</p>
</span>

Back to top

Image Suppression

We replace suppressed images with the pattern below, matching the size of the original image.

You can suppress images by making a small modification to your site code by adding an attribute data-hj-suppress to the image you wish to suppress

<!-- The below will suppress the specific image element-->
<img data-hj-suppress src="hotjarlogo.png" height="250" width="600">

<!-- The below will suppress all images within the <div> element-->
<div data-hj-suppress>
  <img src="image1.png" height="250" width="600">
  <img src="image2.png" height="300" width="500">
</div>

Back to top

Verifying Recording Suppression

For one of our tools, Recordings, you are able to verifying suppression before you start collecting data.

Open a new Google Chrome tab/window with the console panel open

You will need to make sure it is open on the Network tab. At Hotjar we use the Chrome developer tools because it is easier to see this type of data.

Go to a URL on your site where Recordings are enabled.

At least one field needs to be suppressed so you can confirm Hotjar is not sending the keystroke data.

In the Network tab, click on these items - funnel/filter icon > ws.

If Hotjar is recording you, there should be a websocket called ws. This is the websocket we use to stream the data from the visitor's browser to our servers. This includes in it every keystroke, click, page mutation, etc. Click on ws > Frames.

Steps to see data the Hotjar script sends through the websocket to our servers

Once done, a new frame should appear in the right panel in green, however, it is visually seen as a different row.

Copy the content of that frame

Paste it into a notepad

This way you will be able to see the full content of the frame. In it you should see something like this:

Extract from a websocket frame, showing that asterisk symbols are being sent rather than the actual user input.

The image above means that Hotjar tracked keystrokes on the #name field and asterisk symbols were sent to our servers rather than the actual user input as the field is being suppressed. You should see the same thing for your suppressed fields.