Skip to main content

​
Deploy Your AI Chat Widget

After creating your workspace, configure the widget and paste a single script tag on your website. The widget appears as a floating chat bubble in the bottom-right corner of every page where the snippet is loaded.

​
Configure Your Widget

1

Open the Setup Form

From your workspace, open the Web Widget setup. You’ll see fields for the widget’s metadata and brand styling.
2

Fill In the Fields

  • Name — a label for your widget (e.g., “My Website Widget”)
  • Allowed Origins — the domains where the widget may run, one per line. Supports wildcards (*.example.com). Leave empty to allow all.
  • Primary Color — your brand color in hex (e.g., #F97316)
Click Create Widget when ready.
Configure Web Widget form with Name, Allowed Origins, and Primary Color fields
3

Copy the Embed Code

After creation, open the Installation tab on your widget settings. You’ll see a single script tag like this:
<script
  src="https://bestchatbot.io/widget/v1/chat.js"
  data-api-key="rk_live_xxxxxxxxxxxxxxxxxxxx"
  defer
></script>
Installation tab showing the embed code with a copy button
4

Paste on Your Website

Add the script tag just before the closing </body> tag on any page where the widget should appear.
<body>
  <!-- Your website content -->

  <script
    src="https://bestchatbot.io/widget/v1/chat.js"
    data-api-key="rk_live_xxxxxxxxxxxxxxxxxxxx"
    defer
  ></script>
</body>
5

Verify It Works

Open your website in a browser. You should see a chat bubble in the bottom-right corner. Click it to open the chat window and test a question.
Chat widget open on a website

​
Multiple Widgets

Each workspace runs one widget. To manage multiple sites or brands, create one workspace per widget. Each workspace has its own knowledge base, configuration, and usage tracking.
Switch between workspaces using the workspace selector at the top of the dashboard.

​
Next Step

Web Widget Guide

Full guide: customize colors, allowed origins, programmatic API, troubleshooting, and more.