Skip to main content

​
Prerequisites

Before creating Chatbots, ensure you have:
  • Access to Studio
  • An active Chatbot subscription
  • Website access for deployment
You have to whitelist the domain of your website in the organization settings to use the chatbot.
Follow these steps to create and configure a Chatbot:
1

Get Started

Navigate to the website-chatbots page in Studio and click “Create New Chatbot”.
Creating a new chatbot
Creating a new chatbot
2

Configure Content

Configure your chatbot’s content across different screens:Select a Screen and configure its content
Configure chatbot content
3

Configure Behavior

Set up your chatbot’s AI behavior and responses:
  • Import Pre-built Behavior
  • Create Custom Behavior
Quick-start with tested behavior templates that you can customize:
Import behavior
Select behavior
After importing, you can customize all configuration options below:
Choose the AI model that best fits your use case:
Setting AI model
Connect your knowledge sources:
  • Upload documents, website URLs, or text content
Setting AI model
To learn more about sources, check out the Sources guide.
Fine-tune your chatbot settings:
  • Temperature, Max tokens, Response length, Memory handling, Context window
Adjust configuration
4

Configure Style

Customize your chatbot’s appearance:
  • Import Style Template
  • Create Custom Style
Quick-start with pre-built style templates:
Start with our professionally designed templates:
Import style template
Select style template
After importing, you can customize all styling options below:
Fine-tune the imported template:
  • Global styling
  • Lead form styling
  • Conversation styling
  • Chatbot button styling
Adjust styling
You have the option to enable or disable branding for your chatbot.
5

Edit Chabot Settings

Edit the chatbot settings:
  • Enable or disable the chatbot on mobile and desktop
  • Require Login to chat
  • Manage lead capture settings
  • AutoOpen chatbot on mobile and desktop with a delay
Edit chatbot settings
Edit chatbot panel
6

Integration

Add your chatbot to your website:
  • Publish your chatbot to enable integration.
Users on the Free plan cannot integrate the chatbot. Please upgrade your plan to enable these features.
Integration
Integration dialog
Place this code in the <head> tag of your website.

​
Asset Types

Your chatbot can share various types of assets with users:

Documents

PDFs, Word docs, spreadsheets, and other documents

Images

Product photos, diagrams, screenshots, and graphics

Web Pages

External links to landing pages, documentation, or resources

Videos

YouTube and Vimeo video links that play in an embedded player

Calendar Links

Cal.com or Calendly booking links for scheduling meetings

​
Programmatic Control

You can control the chatbot from your website using custom buttons or links:
  • Data Attributes (Easiest)
  • JavaScript API
Add the data-aichatbot-invoke attribute to any HTML element:
<!-- Open chatbot on click -->
<button data-aichatbot-invoke="open">Ask AI Assistant</button>

<!-- Close chatbot on click -->
<button data-aichatbot-invoke="close">Close Chat</button>

<!-- Toggle chatbot on click -->
<a href="#" data-aichatbot-invoke="toggle">Chat with us</a>

<!-- Empty attribute defaults to toggle -->
<div data-aichatbot-invoke>Need Help?</div>
Elements with this attribute are automatically bound when the chatbot loads. No additional JavaScript required!
Features:
  • Works with any HTML element (buttons, anchors, divs, etc.)
  • Supports dynamically added elements
  • Automatically prevents default actions on links
  • No duplicate event listeners
7

Preview and Share

  • Preview on multiple devices
  • Share chatbot preview - Share this link with your customers to let them preview your chatbot.
Preview and share
Preview dialog
Users on the Free plan can create up to 1 chatbot. Upgrade your plan to create more chatbots and access additional features.

​
Next Steps

Return to Overview

Back to Chatbots overview