Privacy API

You can also mask elements in your session recordings using the Privacy API. To mask or hide elements, use the data-sl attribute with one of the values listed in the table.

<div data-sl="mask">
  This text will be replaced by *.
  <div>
    This text will be replaced by *.
  </div>
</div>

📘

Passwords and credit card numbers are not recorded by default.

Payment gateways

Recordings of credit cards is safe because most payment gateways are 3rd-party apps meaning the customer gets redirected to another site. These payment gateways are usually in an iframe which Smartlook also blocks frolm being recorded by default.

You probably noticed the Card number example. Smartlook blocks credit cards in recordings by default. However, your website might use a custom coded payment solution that is either not secure or is coded in such a way that our script does not recognize it. In such rare cases, you can use the Privacy API to be sure your visitors' card numbers are safe and are not recorded.

Masking forms

Forms are everywhere on websites these days. Most of the time, you'll want to mask some of the elements, or the whole form. You can exclude sensitive visitor data from session recordings by masking forms and inputs.

Masking all fields

To mask all fields in a form:

<!-- Mask all fields in a form -->
<form data-sl="mask">
  <div>
    <label>Card number</label>
    <input type="text" placeholder="Card number">
  </div>
  <div>
    <label>Expiration Date</label>
    <input type="text" placeholder="MM-YY">
  </div>
</form>

Masking selected fields

If you do not want to mask the entire form, you can also mask only selected fields.

To mask selected fields in a form:

<form>
  <!-- Mask this field -->
  <div data-sl="mask">
    <label>Card number</label>
    <input type="text" placeholder="Card number">
  </div>

  <!-- This field is not masked -->
  <div>
    <label>Expiration Date</label>
    <input type="text" placeholder="MM-YY">
  </div>
</form>