CoBrowse Settings

How to configure CoBrowse for your agents

CoBrowse enables agents and consumers to access and navigate web pages collaboratively. This ensures that complex online tasks and processes can be completed quickly and efficiently. CoBrowse is the optimal engagement solution for consumers who require security and privacy, yet expect a high level of personal contact.

If On, the CoBrowse invitatation button will appear for Agent in a chat conversation. If Off, it will not.

CoBrowse Mode

Define the level of control your agents can have over CoBrowse.
Configure the CoBrowse mode enabled for agents: View only or Shared. This determines which Agent capabilities during a CoBrowse session.

Back to Top

CoBrowse Colors

Border color: customize the color of the CoBrowse window border shown on the visitor side.
Highlight color: customize the color of the highlight effect that appears after a mouse click.

Back to Top

Match Visitors Viewport

When on, the agent’s viewport will be resized to the size of the visitor’s browser window. This is useful for responsive websites.

Back to Top

Mask Consumer Data From Agent View

In order to hide sensitive visitor data from the Agent during a CoBrowse session, it is possible to mask certain input fields. If a field is masked, the Agent will see a visual indicator the visitor is typing, but will not be able to view the visitor’s input.

   Visitor Screen                                                                                                          Agent Screen

                                    

CSS Selectors are used in the CoBrowse configuration to specify form fields on your website that may contain visitor data which should not be seen on the Agent’s view.

  • Example for IDs: #cc_number => do not synchronize content of the element with id=’cc_number’.
  • Example for class names: .secret => do not synchronize content of elements with class=’secret’.
  • Example for more complex selectors: input[name=\’secure\’] => do not synchronize content of input elements with name=’secure’.

Note: Special characters in selectors must be escaped with a ‘\’ e.g. #id\@123

Feel free to reach out to CAO Support using the chat button below or by email if you need assistance in setting up CoBrowse Masking.

Back to Top

Hide Elements from agent view

In order to protect sensitive data that may be visible to the agent during a CoBrowse session, it is possible to hide certain elements on the page by ID or Class. If an element is hidden, the agent will be able to see the visitor cursor but not the element itself.

Visitor Screen                                                                                                    Agent Screen

                                        

 

Add IDs or Class names which correspond to elements on your website that may contain sensitive data. Setting either of these values keeps the entire element hidden from the Agent’s view during the CoBrowse session.

     Example of hiding elements: <input id=”input-123″ class=”wsite-form-input” type=”text” name=”First” placeholder=”First”>

  • By ID: input-123 => Hide from agent element with id=’input-123’. 
  • By Class: wsite-form-input => Hide from agent element with class=’wsite-form-input’’.

Feel free to reach out to CAO Support using the chat button below or by email if you need assistance in setting up CoBrowse elements hiding.

Back to Top