Live Chat Widget API Overview

This article covers on:

• Client APIs: Manage email, name, phone number, and the “maintainIsOpen” functionality on the client side.
• SDK Events: Handle email form submissions and control the visibility of the message text editor.

Client APIs

To configure your live chat widget, use the window[‘boldChatSettings’] object. Add this script above your embedded code and adjust the property values as needed:

window['boldChatSettings'] = { email: ", name: ", phoneNo: ", maintainIsOpen: true }; 

Email

• Pre-fill the visitor’s email address in the chat widget.
• If the email address is provided, visitors don’t need to enter it manually.
• Once the visitor sends their first message, a conversation is created using the pre-configured email.

window['boldChatSettings'] = { email: "daniel@afgc.inc” }; 

Name

• Pre-fill the visitor’s name in the chat widget. This is applicable only if an email is provided.

window['boldChatSettings'] = { name: "Daniel” }; 

PhoneNo

• Pre-fill the visitor’s phone number in the chat widget. This is applicable only if an email is provided.

window['boldChatSettings'] = { phoneNo: “1234567890” }; 

MaintainIsOpen

• The widget’s open/close state is saved in cookies and synced across tabs.
• { MaintainIsOpen: true } (default): The state is maintained across tabs and reloads.
• { MaintainIsOpen: false }: The state is not saved; each tab operates independently and resets upon page reload.

window['boldChatSettings'] = { maintainIsOpen: false }; 

SDK events

You can use the following SDK events:

• validateForm
• canShow

Initialize $boldChat as an array, if not already done:

window.$boldChat = [] | window.$boldChat; 

onValidateForm

Push a validation method into the $boldChat array:

window.$boldChat.push(["on:validateForm", onValidate]); 

• Handle form submissions using the “on validate” method. Validate the form data and return an object indicating whether the form is valid.

<script type="text/javascript" >
      window.$boldChat = window.$boldChat || [];
      window.$boldChat.push(["on:validateForm", onValidate]);
      function onValidate(formData) {
          return new Promise((resolve) => {
             var response = { isValid: false, confirmationMessage: "User is not a valid user." };
             resolve(response);
          });
      }
  </script> 

Response format:

{ 
isValid: boolean, 
confirmationMessage: string
} 

canShow

Control the visibility of the live chat widget’s text editor:

• To hide the text editor:

window.$boldChat.push(["set:canSend", "false"]); 

• To show the text editor:

window.$boldChat.push(["set:canSend", "true"]);