How to setup frontend Chat API
This feature is available in selected plans only. At the moment it allows you to hide/show chat widget and introduce your own callbacks for chat events.
Actions
You can execute one of following methods showChat, hideChat and toggleChat. First you need to obtain access to the frontend API of the chatbot. To do that run the following:
window.aichatbotApi.getChatbotApi(chatbotId)
The value of chatbotId is available in your chatbot overview pane in the chatbot admin.
The object return has following methods
- showChat() - shows the chat
- hideChat() - hides the chat
- toggleChat() - shows/hides/shows hides..
- sendMessage(message) - sends message to the chatbot (same as user would type it in the chat widget)
Callbacks
Two chat events are available:
- user message - handled by onUserMessage(userMessage:string)
- chatbot message - handled by onChatbotMessage(chatbotMessage:string)
In order to add such callbacks to your chatbot you need to add following script snippet to your html page:
<script>
window.aichatbotCallback = {
onUserMessage(message) {
console.log('onUserMessage', message);
/*your handler for the user message
....
*/
},
onChatbotMessage(message) {
console.log('onChatbotMessage', message);
/*your handler for the chatbot message
....
*/
},
}
</script>