Skip to content

Widget API

The WebChat Widget API allows you to interact with the WebChat Widget from your website. You can use the API to open the widget, send messages, and more.

Passing Data

WebChat widget allows website integrators to pass Workflow data through the widget.

The website can define the function "getDataForBuzzeasy" which will be called by Buzzeasy upon sending the first customer message.

javascript
window.getDataForBuzzeasy = function(){
  return Promise.resolve({
    workflowData: { 
        "Key1": "Value1", 
        "Key2": "Value2" 
    },
    customerData: {
        firstName: string;
        lastName: string;
        email: string;
        phone: string; 
    }
  });
};
  1. workflowData: A dictionary containing the workflow data key-value pairs that you want to pass to the widget. Use the workflow data if you want to use the data in the workflow for decision making, or if you want to pass data which is relevant to the current session only.
  2. customerData: An object containing the customer data that you want to pass to the widget. Use the customer data if you want to use the data for personalization purposes. The email or the phone will be used to match the customer with the existing customer in the system.

Calling the API

If you are calling the API from your website, you should wait for the initialization of the WebChat Widget. You can do this by listening to the buzzeasyWebChat-integrationLoaded event:

javascript
window.addEventListener('buzzeasyWebChat-integrationLoaded', function() {
  // Your code here
});

Opening the Widget

To open the WebChat Widget, you can use the following code snippet:

javascript
window.buzzeasyWebChat.openWidget();

This code snippet will open the WebChat Widget on your website.

Sending Messages

There are two types of messages that you can send to the WebChat Widget (these messages are not sent to the server):

  • Invite messages: These messages are displayed in the chat window when the widget is opened.
javascript
window.buzzeasyWebChat.sendProactiveMessage({type: 'InviteMessage', messageText: 'This is a test message from the client-side API', suggestedActions: ['Start!']})
  • Promotional messages: These messages are displayed above the chat bubble if the chat widget is minimized.
javascript
window.buzzeasyWebChat.sendProactiveMessage({type: 'PromotionalMessage', messageText: 'This is a test message from the client-side API', suggestedActions: ['Start!']})

Attention Hooks

Attention hooks are used to get the user's attention when the widget is minimized. You can use the following code snippet to add an attention hook:

javascript
window.buzzeasyWebChat.attentionHooks.displayMessage({ text: 'This is an attention hook message' });

The attention hook message will be displayed above the chat bubble when the widget is minimized, and it will not be visible in the chat history when the widget is expanded.