1. Home
  2. Docs
  3. API
  4. Add Chatbot Widget to your Website

Add Chatbot Widget to your Website

Integration

To integrate the chatbot into your site, please add the following code to your website:

<script type="text/javascript">
var C1_ChatBot_Obj=C1_ChatBot_Obj||{};
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=false;
s1.src='//files.conversation.one/chatbot/1.0/chatbot_script.js';
s1.charset='UTF-8';
document.addEventListener("DOMContentLoaded", function(event) {
s1.onload = function(){
C1_ChatBot_Obj.init({"domain":"AppID"});
};
s0.parentNode.insertBefore(s1,s0);
});
})();
</script>

Customization

To customize the chatbot, change the init code.

Chatbot parameters:

Parameter Description Required Default
domain String. Domain ID of your app V
baseURL String. The base url of the chatbot. Chatbot src combined by baseURL and domain V https://engine.conversation.one/chatbot/
width String. Element width on site X 400px
height String. Element height on site X 400px
position String. Element position on site.Possible values : right  / left X right
backgroundColor String (rgb/hex/color). Chatbot background color X purple
textColor String (rgb/hex/color). Chatbot text color X #ffffff
title String. Chatbot title. Can include HTML tags. X Online
maxMinimizeBtn String (html element). Html for the max-minimize button X svg
minimizeBtn String (html element). Html for the minimize button X svg
popBtn String (html element). Html for the pop-out button X svg
exitBtn String (html element). Html for the exit button X svg
openOnStart Boolean. Automatically open chatbot on start X false
openByImage Boolean. Use image as a button to open the chatbot (to use this option please provide image to the ‘chatImage’ parameter) X false
chatImage String. Path of your button image X false
imgWidth String. Image button width X 80px
imgHeight String. Image button height X 80px
enableClose Boolean. Display exit button X false

 

Was this article helpful to you? Yes 1 No 1

How can we help?