The chat widget in ChatBot is a default chat window that functions as your chatbot interface. You can customize its look and feel by adding a custom avatar or text. The upside of the chat widget is that you can add it to your website without coding.Ā
How to add ChatBot to your website
-
Log in to ChatBot.
-
To install the widget on your website, open your selected story, navigate to the Integrations icon, and click Connect next to the Chat Widget option.
-
Click on the Publish section.
-
Click Copy minify code to copy the code.
-
Paste the code to your websiteās source code before the /body closing tag.
How to embed Chat Widget on a website
By default, the Chat Widget canāt be embedded as an element of the page. However, there is a workaround that lets you do it. See how it can lookĀ here.
To get the source code, you can check our GitHub repository. There are two files; one of them has the Chat Widget code installed (widget.html), and the other uses the iframe element that loads it at a specific place on the page (index.html). The widget.html file also contains code that opens the plugin when the page loads.
Embed the ChatBotās chat widget on other stores and platforms
ChatBot provides free and ready-to-use integrations that allow you to add a bot to e-commerce platforms or connect it with popular web builders. Follow the following tutorials to learn more:Ā
Connect ChatBot with any service using Zapier
The next stepsĀ 
-
Customize the chat widget - design your botās visual appearance and make the widget style consistent with your website.
-
Set up a catchy greeting - attract more website visitors to start chatting.
-
Watch Visual Builder basics - learn how to design bot flows in ChatBot.
-
Learn with ChatBot Academy - follow the video lessons on chatbot design and implementation.