The Chatbot is available through our CDN as a single JavaScript file or through NPM as a React component package.

<script type="module">
import Chatbox from 'https://cdn.jsdelivr.net/npm/@chatiii/embeds@1.0.231/dist/chatbox/index.min.js';

Chatbox.initBubble({
agentId: 'YOUR_AGENT_ID',
});

</script>

Attributes / Props

<script type="module">
import Chatbox from 'https://cdn.jsdelivr.net/npm/@chatiii/embeds@1.0.231/dist/chatbox/index.min.js';

Chatbox.initBubble({
agentId: 'YOUR_AGENT_ID',

// If provided will create a contact for the user and link it to the conversation
contact: {
firstName: 'John',
lastName: 'Doe',
email: 'customer@email.com',
phoneNumber: '+33612345644',
userId: '42424242',
},
// Override initial messages
initialMessages: [
'Hello Georges how are you doing today?',
'How can I help you ?',
],
// Provided context will be appended to the Agent system prompt
context: "The user you are talking to is John. Start by Greeting him by his name.",

});

</script>
agentId
string
required

ID of the Agent

contact
string
initialMessages
string array

Initial Agent messages

context
string

Extra context that will be appended to the Agent system prompt

Methods

open
bubble widget only

Open Bubble Chatbox

const widget = await Chatbox.initBubble({
  agentId: 'YOUR_AGENT_ID',
})

widget.open()

close
bubble widget only

Close Bubble Chatbox

const widget = await Chatbox.initBubble({
  agentId: 'YOUR_AGENT_ID',
})

widget.close()
toggle
bubble widget only
Toggle Bubble Chatbox
const widget = await Chatbox.initBubble({
  agentId: 'YOUR_AGENT_ID',
})

widget.toggle()
createNewConversation
Create New Conversation
const widget = await Chatbox.initBubble({
  agentId: 'YOUR_AGENT_ID',
})

widget.createNewConversation()

Was this page helpful?