Build your bot using ChatBot API

Chat Widget API

Chat window API allows you to manipulate the chat widget displayed on your website. Some common use–cases are:

  1. making the chat window pop out at the specific moment,
  2. changing the default chat bubble to custom image.

Available methods

Hooks

onBeforeLoad

Callback function invoked when widget code is loaded but chat window is not rendered yet. You can return false to stop the widget initialization.

window.BE_API = window.BE_API || {};
window.BE_API.onBeforeLoad = function () {
    // return false
};

onLoad

Callback function invoked when widget code is loaded and chat window is rendered.

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    // ...
};

onCreate

Callback function invoked after create() API method call.

window.BE_API = window.BE_API || {};
window.BE_API.onCreate = function () {
    // ...
};

onDestroy

Callback function invoked after destroy() API method call.

window.BE_API = window.BE_API || {};
window.BE_API.onDestroy = function () {
    // ...
};

onChatWindowOpen

Callback function invoked when the chat window is opened.

window.BE_API = window.BE_API || {};
window.BE_API.onChatWindowOpen = function () {
    // ...
};

onChatWindowClose

Callback function invoked when the chat window is closed.

window.BE_API = window.BE_API || {};
window.BE_API.onChatWindowClose = function () {
    // ...
};

onChatWindowHide

Callback function invoked when the chat window is hidden.

window.BE_API = window.BE_API || {};
window.BE_API.onChatWindowHide = function () {
    // ...
};

onMessage

Callback function invoked after query result.

window.BE_API = window.BE_API || {};
window.BE_API.onMessage = function (result) {
    console.log(result)
};

onStartConversation

Callback function invoked after the conversation starts.

window.BE_API = window.BE_API || {};
window.BE_API.onStartConversation = function () {
    // ...
};

Methods

create

Create chat widget if does not exist

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.create();
};

destroy

Destroy chat widget if exist

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.destroy();
};

isInitialized

Returns true if the chat is initialized.

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.isInitialized();
};

resetSession

Reset current session and recreate widget.

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.resetSession();
};

openChatWindow

Open the chat window, should be used only inside window.BE_API.onLoad callback

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.openChatWindow();
};

closeChatWindow

Close the chat window, should be used only inside window.BE_API.onLoad callback

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.closeChatWindow();
};

hideChatWindow

Hide the chat window, should be used only inside window.BE_API.onLoad callback

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.hideChatWindow();
};

isChatWindowOpened

Should be used only inside window.BE_API.onLoad callback. Returns true if the chat window is open.

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.isChatWindowOpened();
};

isChatWindowClosed

Should be used only inside window.BE_API.onLoad callback. Returns true if the chat window is closed.

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.isChatWindowClosed();
};

isChatWindowHidden

Should be used only inside window.BE_API.onLoad callback. Returns true if the chat window is hidden.

window.BE_API = window.BE_API || {};
window.BE_API.onLoad = function () {
    window.BE_API.isChatWindowHidden();
};

setUserAttributes

Set user attributes. Read more about user attributes here.

Payload
parameter type description
Object Object( Entry Object(1, 99) ) required Object with entries
Entry Object
parameter type description
key String(1, 128) Attribute name
value String(1, 1024) Attribute value
window.BE_API = window.BE_API || {};
window.BE_API.onLoad = () => {
    window.BE_API.setUserAttributes({
        email: 'support@chatbot.com',
        name: 'ChatBot Support'
    })
}

setSessionAttributes

Set your custom attributes that will be sent to the query. Each method call will overwrite existing parameters. Read more about attributes here: https://www.chatbot.com/docs/chat#parameters

Payload
parameter type description
Object Object( Entry Object(1, 99) ) required Object with entries
Entry Object
parameter type description
key String(1, 128) Attribute name
value String(1, 1024) Attribute value
window.BE_API = window.BE_API || {};
window.BE_API.onLoad = () => {
    window.BE_API.setSessionAttributes({
        email: 'support@botengine.ai',
        name: 'Botengine Support'
    })
}

sendMessage

Send a message as visitor.

Payload
parameter type description
payload.message String(1, 256) required Message
payload.postback String(1, 256) Postback
window.BE_API = window.BE_API || {};
window.BE_API.onLoad = () => {
    window.BE_API.sendMessage({
        message: 'message',
        postback: 'postback'
    })
}

sendTrigger

Trigger the specific interaction.

Payload
parameter type description
payload String(1, 50) required Trigger name
window.BE_API = window.BE_API || {};
window.BE_API.onLoad = () => {
    window.BE_API.sendTrigger('custom_trigger')
}

Examples

Custom Chat Button

Change the default chat bubble (circle) to your own button with the use of this example. The code is available here.

Start a free ChatBot trial
and build your first chatbot today!

Free 14-day trial No credit card required