How to Mask Data Fields in Cobrowse

During a cobrowse session, your visitor may need to enter sensitive information such as their social security number, credit card details, or answers to security questions. Block these inputs from appearing in Acquire using data masking. No web development experience? No problem! We’ll walk you through the basics.

In this article:

• Choosing the Right Masking Tool
• Using Inspect to Select Elements
• Masking Data Fields

What you’ll need:

• The latest Chrome browser

Choosing the Right Masking Tool 

Acquire offers two masking options: Input Field Selector and Disabled View. 

Use Input Field Selector when you want to mask the data, but not the input field itself. 

Use Disabled View when you want to mask an entire section, such as a payment form.

  

Step 1: How to Select Elements with Inspect

While accessing the relevant webpage from a Google Chrome browser, right-click and choose ‘Inspect’ from the drop-down menu. 

The developer tab will then appear. Select the arrow button at the far left of the Navigation bar.

Click on the element on the page you want to mask. 

The code for that element will highlight in the HTML panel. 

Copy the content you want masked using either the ID or Class attribute. In the example below, the content in the ID attribute is “pwd”. 

Step 2: Masking Data Fields

Configure data masking rules by heading to Settings > Installation and Setup > Cobrowse Settings > Advanced Configuration. Then paste content into ‘Disabled Input Field Selector’ or 'Disabled view'.

To hide fields, enter the CSS selector followed by the content found in your website HTML code.
Supported CSS selectors include:

• # for IDs
• . for a classes

If you need to mask multiple fields, separate content with a comma. 

Press ‘Save Settings’ when you’ve finished entering the fields you want to mask. 

When to Use Hashtags (‘#’) vs. Dots (‘.’)

Use ID attributes (‘#’) when you want to mask a single element, such as an input field.

Use Class attributes (‘.’) when you want to mask a group of elements, such as a form.

You may need to select multiple elements until you find a class tag.

Now you’re ready to protect your customer’s information! If you’re unsure of which elements to mask, reach out to your web developer or contact us at support@acquire.io.