Chatbot
Advanced
Implement a custom wrapper

Chatbot - Implement a custom wrapper

How it works

The Chatbot comes with a default wrapper, which includes basic open/close functionality, a button to open the Chatbot, and a header with a headline and description.

However, in some cases, you might want to implement your own wrapper.

Using the -body element

For this, you can use the <ab-chat-body> element.

HTML
<div className='custom-container'>
  <ab-chat-body
    chatbotID='YOUR-CHATBOT-ID'
    // ...additional attributes
  ></ab-chat-body>
</div>

The <ab-chat-body> receives all the attributes of the <ab-chat> element.
It does not include the open(), close() and toggle() methods.

See all the available attributes in the Chatbot Reference.

Adding additional contextReference