Web Widget

The Web Widget displays your assistant as a floating chat window on a website. Assistant Core provides the interface, streaming, conversation history, Markdown, dark mode, and mobile layout.

Before you beginCopy Anchor Link

• You can manage the assistant in the Admin Panel.
• Your current plan includes the Web Widget feature.
• You know the website's exact origin, such as https://www.example.com.

1. Allow the websiteCopy Anchor Link

1. Open the Admin Panel and select your assistant.
2. Go to Channels → Web Widget.
3. Under 1. Allow Websites, enter the complete origin.
4. Select Add Website, then select Save Changes.

Valid origin examples:

https://www.example.com
https://preview.example.com
http://localhost:3000

Add production, staging, preview, and local development origins separately. https://example.com and https://www.example.com are different origins.

2. Install the widgetCopy Anchor Link

Under 2. Install the Widget, select Copy Snippet. The generated snippet already contains the assistant ID and API base for your environment:

<script
  src="https://cdn.assistantcore.com/embed/embed.js"
  data-assistant-id="YOUR_ASSISTANT_ID"
  data-api-base="https://api.assistantcore.com"
  async
></script>

Add the script once near the end of <body> or in your framework's root layout. The async attribute lets the widget load without blocking the page's primary content.

HTMLCopy Anchor Link

<body>
  <!-- Website content -->

  <script
    src="https://cdn.assistantcore.com/embed/embed.js"
    data-assistant-id="YOUR_ASSISTANT_ID"
    data-api-base="https://api.assistantcore.com"
    async
  ></script>
</body>

Next.jsCopy Anchor Link

Add the script to the root layout so client-side navigation does not reload it:

import Script from "next/script"

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>{children}</body>
      <Script
        src="https://cdn.assistantcore.com/embed/embed.js"
        data-assistant-id="YOUR_ASSISTANT_ID"
        data-api-base="https://api.assistantcore.com"
        strategy="lazyOnload"
      />
    </html>
  )
}

3. Allow visitor attachments (optional)Copy Anchor Link

By default, website visitors can send text only. To let them attach files, turn on Visitor Attachments → Allow file uploads on the same page. The setting is saved as soon as you toggle it.

• Supported files: images (PNG, JPEG, GIF, WebP), PDF, Word, Excel, CSV, and text files.
• Maximum size: 25 MB per file.
• Uploaded files are stored in your workspace and count toward your usage.

Script attributesCopy Anchor Link

If the page has <html lang="vi">, the widget selects Vietnamese when data-lang is not set.

PrivacyCopy Anchor Link

The widget stores a visitor identifier in local storage and sends chat content to your assistant for processing. Before publishing:

• Update your website's privacy policy when required.
• Do not include secrets or data you are not permitted to process in test messages.
• Review consent requirements for the markets where you operate.

Verify the installationCopy Anchor Link

1. Open the site from the exact origin you allowed.
2. Confirm that the chat launcher appears.
3. Send a test message and confirm that the response streams.
4. Test on mobile and in dark mode.

TroubleshootingCopy Anchor Link