Skip to main content
Skip table of contents

Masking

Hiding sensitive information from following-participants

By using Surfly's masking features, you can ensure that confidential information remains private during collaborative sessions. Surfly provides two masking features, Element Masking and Field Masking:

Element Masking allows you to hide entire HTML elements from followers by including their CSS selectors in the hide_element_by_selector option. It does not require any alterations to the web-application's code, and as such, it can be employed on third-party websites as well. You can set it up through the Surfly dashboard or the Javascript API.

How to find CSS selector in Chrome browser

You can follow below steps to find CSS selector of an element you want to configure Element masking:

  1. Hover the cursor over the image and right click mouse.

  2. Select Inspect.

  3. See the highlighted image code.

  4. Right click on the highlighted code.

  5. Select Copy > Copy selector.

An example showing how to find the CSS selector for an element on google.com

The surfly-masked CSS class can be used to customize masking, but this will require making simple code changes to your website/application.

For an example implementation of both the default and customized Element Masking, visit our demo page.

https://example.surfly.com/element-masking/

Field Masking allows you to conceal specific form fields from following-participants, preventing them from viewing the tab-owner's input. Credit card and password fields are automatically masked by default. You can add the surfly_private attribute to other fields containing sensitive information, but this will require making simple code changes to your website/application.

CODE
<span>Email address</span>
<input type="text" size="20" surfly_private>

Please note that there is an exception to field masking when masked elements/fields are present in an HTML form with method="get" or if the field's value is used in the URL. In such cases, although the fields are masked and not visible to followers in the user interface, the values entered in those fields can still be tracked through Audit Logs (relocate_start event) and may be exposed through browser network activity.

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.