Skip to main content
Add your AI assistant to any website with a customisable widget that supports voice calls, text chat, or both.
Web Widget is a premium feature. Confirm your plan includes web widget access before configuring.

Widget modes

Choose how visitors interact with your assistant:

Accessing widget configuration

1

Open your assistant

Navigate to your assistant’s edit page.
2

Open the widget panel

Click the Web widget button. The configuration panel opens with a live preview.

Configuration options

General tab

  • Widget mode: Voice, Chat, or Voice & Chat.
  • Widget size:
    • Standard — compact floating widget suitable for most use cases.
    • Extra large — half-screen panel on desktop, full-screen on mobile; ideal for detailed conversations.
  • Position: Choose from 8 positions (bottom-right, bottom-left, bottom-center, middle-right, middle-left, top-right, top-left, top-center).
  • Primary colour: Brand colour for buttons and accents.
  • Toggle button size: Small or Normal.
  • Toggle button style: Animated (glass morphism) or Simple (flat design).
  • Auto-open on page load: When enabled, the widget expands automatically when the page loads — no click required.

Button tab

  • Custom avatar: Upload your own avatar image (max 512 KB, 1:1 square aspect ratio) to replace the default widget icon.
  • Button main text (default: “Need help?”)
  • Button sub text (default: “Chat with us”) — hidden when using the small button size.
  • Tab labels (Voice & Chat mode):
    • Voice tab label (default: “Voice”)
    • Chat tab label (default: “Chat”)

Header and modal tab

  • Header title (default: “AI Assistant”)
  • Header subtitle (default: “Ready to help you ✨”)
  • Modal title (default: “Ready to chat?”)
  • Start button text (default: “Start Voice Chat”)
  • Modal description (default: “Click below to start your conversation”)

Chat settings tab

This tab is only visible when the widget mode includes chat (Chat Only or Voice & Chat).
  • Chat placeholder (default: “Type your message…”)
  • Send button label (default: “Send message”)
  • Show function calls: When disabled (default), tool calls such as calendar lookups are hidden from the chat, keeping the conversation clean for visitors. Enable to show tool usage details.
Clickable links in chat The chat widget supports markdown formatting. To include clickable URLs, use markdown link syntax in your assistant’s prompt or initial message:
Check out our [latest offers](https://example.com/offers) or visit our [help centre](https://example.com/help).
Add an instruction to your assistant’s prompt: “When sharing links or URLs, always format them as clickable markdown links” — this ensures the AI consistently outputs clickable links.

Voice settings tab

This tab is only visible when the widget mode includes voice (Voice Only or Voice & Chat).
  • Connecting text (default: “Connecting…”)
  • Disconnect text (default: “Disconnect”)
  • Error text (default: “Connection failed. Please try again.”)

Pre-chat form

Collect information from visitors before starting the conversation. Form configuration:
  • Pre-form title (default: “Before we start…”)
  • Pre-form description
  • Submit button text (default: “Continue”)
Form fields: Add custom fields to collect visitor data:
SettingDescription
Variable nameMaps to your assistant’s variables. Letters, numbers, dashes, and underscores only.
Field labelThe label shown to visitors
Field typeText, Email, Phone, or Textarea
RequiredMakes the field mandatory
PlaceholderPlaceholder text shown in the field
Helper textOptional description below the field
Form field names automatically map to your assistant’s variables, making collected data available during conversations.

AI response settings

AI enabled: When on (default), the AI assistant automatically responds to incoming messages. Turn this off to collect messages without AI replies — useful for manual-only workflows.

Conversation webhook

Webhook URL: Enter a URL to receive a webhook notification whenever a new conversation starts via the widget. Use this to trigger automation flows, log events to your CRM, or notify your team in real time.

Widget display

Enable widget: Master toggle that controls whether the widget loads on your website. When disabled, the widget won’t appear even if the embed script is installed. Use this to temporarily hide the widget without removing code from your site.

Live preview

At the top of the configuration panel, a live preview shows exactly how your widget will look and behave. The preview updates in real time as you change settings.
  • Copy preview URL — copy the URL to open in a separate tab or share with your team.
  • Reset data — clear stored conversation history, form submissions, and preferences to simulate a first-time visitor experience.
The preview is fully interactive. Click the widget button, fill out the pre-chat form, and start a real conversation to test your configuration before deploying.

Installing the widget

1

Configure and save

Set up your widget options and click Save.
2

Copy the embed code

In the Embed Code section, click Copy.
3

Add to your website

Paste the script tag before the closing </body> tag on every page where you want the widget to appear:
<script src="https://portal.intellixent.ai/embed.js"
        data-assistant-id="your-assistant-id">
</script>
4

Verify

Visit your website and confirm the widget appears in the configured position.
5

Test

Test voice/chat functionality and the pre-chat form (if configured).
Save your widget settings before copying the embed code. The script loads all configuration from the server, so unsaved changes won’t appear on your website.

Technical requirements

HTTPS (SSL certificate) is required for voice functionality. HTTP sites can only use chat mode due to browser microphone security restrictions.

Conversation tracking

All widget conversations appear in your Conversations page for review and analysis.

Troubleshooting

For setup and configuration issues, see Web Widget troubleshooting.