Embed Widget

Add your InsiteChat chatbot to any website with a single embed code. The widget adds a chat icon to the corner of your page — visitors click it to open a full chat interface. No plugins or developers required.

Getting started

Open your chatbot

Copy your chatbot ID

Go to the Overview tab. Your unique Chatbot ID is displayed with a Copy button. You’ll need this for integrations and API calls.

Choose an embed method

Go to the Embed tab and choose from three options: Script tag (recommended), iFrame, or direct link.

Paste into your website

Follow the platform-specific instructions below.

Test

Visit your site, click the chat icon, and send a test message.

Your Chatbot ID is required for:

WordPress and Shopify plugins
API calls and developer integrations
Webhook configuration
Third-party platform setup

Embed options

Script Tag (Recommended)
iFrame Embed
Direct Link

The script tag is the best option for most websites. It creates an iframe that automatically positions the chatbot and supports all features.Why choose script embed:

Automatic positioning based on your widget settings (left/right, icon size, distance)
Responsive — adapts when chat opens/closes
Supports all customization features (auto-open, RTL, personas, etc.)
Minimal performance impact with deferred loading

Code snippet:

<script>
  (function(){
    var d=document,s=d.createElement('iframe');
    s.src='https://insitechat.ai/embed/YOUR_CHATBOT_ID';
    s.style.cssText='position:fixed;bottom:0;right:0;width:420px;height:650px;border:none;z-index:9999;';
    s.allow='clipboard-write';
    d.body.appendChild(s);
  })();
</script>

Replace YOUR_CHATBOT_ID with your actual Chatbot ID. The Embed tab provides this code pre-filled with your ID.

Use the iFrame embed when you need specific positioning or when JavaScript is restricted.

<iframe
  src="https://insitechat.ai/embed/YOUR_CHATBOT_ID"
  style="position:fixed;bottom:0;right:0;width:420px;height:650px;border:none;z-index:9999;"
  allow="clipboard-write"
></iframe>

Adjust width, height, bottom, and right values to fit your design. Change right to left if your widget is configured for the left side.

Share your chatbot as a standalone page — useful for email signatures, QR codes, or social media bios.

https://insitechat.ai/embed/YOUR_CHATBOT_ID

Opens as a full-page chat interface. No embedding required.

Platform-specific instructions

WordPress

Plugin (Recommended)
Theme Editor (Advanced)

Install plugin

In your WordPress admin, go to Plugins > Add New Plugin. Search for a header/footer code plugin like WPCode or Insert Headers and Footers. Click Install Now, then Activate.

Open settings

Go to Code Snippets > Header & Footer (or the plugin’s settings page).

Paste code

Paste the InsiteChat embed code in the Footer section.

Save

Click Save Changes. The chatbot appears on all pages immediately.

Theme editor changes may be lost during theme updates. Use the plugin method for a safer approach.

Open theme editor

Go to Appearance > Theme Editor.

Edit footer

Select your active theme and open footer.php.

Add code

Paste the embed code just before the closing </body> tag.

Update

Click Update File.

Shopify

Access themes

From your Shopify admin, go to Online Store > Themes.

Edit code

Find your current theme and click Actions > Edit code.

Open theme.liquid

In the Layout section, click on theme.liquid.

Add embed code

Scroll to the bottom and paste the embed code just before the closing </body> tag.

Save

Click Save. The chatbot appears on all pages of your store.

To add the chatbot to specific pages only, edit individual page templates instead of theme.liquid.

Squarespace

Open settings

Code injection

Click Advanced, then Code Injection.

Add code

In the FOOTER section, paste the embed code.

Save

Click Save.

Code Injection is available on Squarespace Business plans and higher. Personal plans require an upgrade.

Wix

Open editor

Open your Wix Editor.

Access settings

Click Settings in the top menu.

Custom code

Go to Custom Code in the Advanced section.

Add code

Click + Add Custom Code and paste the embed code.

Configure

Set “Add Code to Pages” to All Pages and “Place Code in” to Body - end.

Apply

Click Apply.

Webflow

Open project settings

Open your Webflow project and go to Project Settings (gear icon).

Custom code tab

Click on the Custom Code tab.

Add footer code

In the Footer Code section, paste the embed code.

Save and publish

Click Save Changes and publish your site.

You can also add the code to specific pages by using a Webflow Embed element and pasting the code there.

Custom HTML / Static Sites

For any website where you can edit HTML:

Copy embed code

Copy the script embed code from the Embed tab.

Open HTML

Open your website’s HTML file in a text editor.

Paste code

Add the code just before the closing </body> tag.

Save and upload

Save the file and upload to your web server.

Full example:

<!DOCTYPE html>
<html>
<head>
    <title>My Website</title>
</head>
<body>
    <h1>Welcome to my website</h1>

    <!-- InsiteChat embed — paste before </body> -->
    <script>
      (function(){
        var d=document,s=d.createElement('iframe');
        s.src='https://insitechat.ai/embed/YOUR_CHATBOT_ID';
        s.style.cssText='position:fixed;bottom:0;right:0;width:420px;height:650px;border:none;z-index:9999;';
        s.allow='clipboard-write';
        d.body.appendChild(s);
      })();
    </script>
</body>
</html>

Verifying installation

Clear browser cache

Clear your cache or use Ctrl+Shift+R / Cmd+Shift+R for a hard refresh.

Open incognito window

Visit your website in an incognito/private browser window.

Locate chat icon

Look for the chat bubble icon in the bottom corner of the page.

Open and test

Click the icon to open the chatbot. Send a test message to verify it responds correctly.

Check customization

Verify that your brand color, logo, display name, and greeting message appear as configured in the Embed tab.

Troubleshooting

Chatbot not appearing

Verify the embed code is present in your page source (right-click > View Page Source, search for “insitechat”)
Check the browser console (F12) for JavaScript errors
Ensure your chatbot has been trained with at least one source
Confirm the chatbot is active (not deleted or disabled)
Try a different browser or device

Chatbot appears but doesn't respond

Verify your chatbot has trained content (check Sources tab — at least one source should be “done”)
Check the Overview dashboard — training status should be “Ready”
Test in the Preview tab first to isolate whether the issue is with the chatbot or the embed

Multiple chat icons appearing

Check that you haven’t added the embed code multiple times
Verify you’re only using one embed method (script OR iframe, not both)
Search your page source for duplicate InsiteChat scripts

Widget position is wrong

Auto-open not working

Auto-open only triggers once per browser session (uses sessionStorage)
Check that auto-open is enabled in the Embed tab for the correct device (desktop vs mobile)
The delay must pass before the widget opens — check the configured delay value
Try clearing sessionStorage or opening a new incognito window

All these features are configured in the Embed tab and work automatically once the widget is embedded:

Feature	Description
Brand color & text color	Custom colors for header, bubbles, and buttons
Font size	12–20px base font size
Chat icon size & position	S to 2XL, configurable distance from edges
Auto-open	Separate desktop/mobile toggles with delay
RTL mode	Right-to-left layout for Arabic, Hebrew, etc.
Personas	Pre-built or custom personality
Chat modes	AI, Agent, or Hybrid
Localization	14 customizable UI strings
Quick prompts	Up to 5 starter questions before first message
Smart follow-ups	AI-generated suggestion buttons after responses
Source citations	Clickable source links below responses
Hide feedback	Toggle off thumbs-up/down on bot messages
Lead capture	Custom forms with configurable timing
Session timeout	Auto-expire conversations after inactivity
Conversation history	Visitors can resume past sessions
Watermark	Customizable on Growth+ plans

See Widget Customization for detailed configuration instructions.

Get Started

Training Your Chatbot

Customization & Deployment

Dashboard & Conversations

Integrations

Account & Billing

Resources

Concepts

Compare

About

Embed Widget — Add AI Chatbot to Any Website

Getting started

Embed options

Platform-specific instructions

Verifying installation

Troubleshooting

Widget features reference

​Embed widget

​Getting started

​Embed options

​Platform-specific instructions

​Verifying installation

​Troubleshooting

​Widget features reference

Embed widget

Getting started

Embed options

Platform-specific instructions

Verifying installation

Troubleshooting

Widget features reference