Chat Agents & the Web Chatbot Widget

Cloudax Connect runs two kinds of agents on the same prompt engine: voice agents for phone calls and chat agents for text channels. Chat agents use system prompts, custom REST tools and linked knowledge bases. Voice-only controls are omitted, and MCP servers, event webhooks and connected-app integrations do not currently have feature parity with the web-chat runtime.

One conversation model, many channels

Whether the visitor reaches your agent through the embedded widget, standalone chat URL, a provisioned SMS number or a connected WhatsApp Business channel, the conversation uses the same underlying conversation model. Calls, web chats, SMS and WhatsApp messages surface together in the Omnichannel Inbox for human follow-up. SMS and WhatsApp require channel setup before they can receive or send messages.

Creating a Chat Agent

Open Chat Agents from the sidebar and click Create chat agent. You can start from a blank canvas or convert an existing voice agent (the voice-only options are stripped out automatically: STT, TTS, voice picker and telephony settings are all hidden from the chat editor).

The chat agent editor mirrors the voice agent editor, minus voice:

System prompt: the instructions that define the agent's behaviour.
Opening message: the first message the agent posts when a visitor opens the chat.
LLM model & temperature: the language model and creativity dial.
Custom tools and knowledge bases: a chat agent can call active custom REST tools and search linked uploaded documents.
Comments tab: collaborative inline notes so your team can review and iterate on the agent together.

Availability

Web chat agents are available where the Web-chat agents entitlement is included. SMS additionally requires a Cloudax-managed SMS number, and WhatsApp requires a completed WhatsApp Business channel setup.

Testing the Chat Agent

The chat agent editor has a live preview pane on the right. Type into the preview and your unsaved changes (system prompt tweaks, model swaps, temperature changes) are picked up the next time you send a message. Use this to dial in the agent's tone before pasting the embed snippet on your website.

The Embed Centre

Open the Embed tab in the right rail of the chat agent editor to design and ship the widget. The Embed Centre provides a live preview alongside every configuration control, so you can see exactly how the widget will look on your site before you copy the snippet.

Customisation Options

Chatbot Name

Set the display name shown in the chatbot header bar. This is the first thing visitors see when the widget opens; choose something friendly and recognisable, such as your brand name or a descriptive label like "Support Assistant".

Icon

Choose an icon for the floating chat button and the header. The available options are:

Icon	Best for
`MessageCircle`	General chat and customer support
`Bot`	AI-forward branding where you want to highlight automation
`Headphones`	Help desks and support centres
`Sparkles`	Creative or playful brands
`Zap`	Fast-response or sales-oriented agents
`MessageSquare`	A subtle, professional alternative to MessageCircle

Colours

The colour picker lets you override the widget's default look on a per-element basis: chat panel background, user message bubbles, bot message bubbles, header background, header text, input field background and text. Each swatch starts in “inherit” mode (rendered as a hatched square) so you only override the things you actually want to change; leave the rest on defaults to keep the standard glassmorphic look.

The Embed Centre also runs a live contrast check on every colour pairing and warns you when the chosen palette fails WCAG AA contrast against the background. Click Reset on any swatch to drop back to the default.

Match your brand

Match the panel background and header to your website's primary palette for a seamless, integrated look. If you're unsure, copy the hex values from your existing style guide; the live contrast meter will tell you immediately if they need adjusting for readability.

Auto-Open

When enabled, the chatbot window opens automatically as soon as the page loads (useful for proactive engagement on landing pages or support pages). When disabled (the default), visitors must click the floating button to start a conversation.

Use auto-open sparingly

Auto-open works best on high-intent pages like pricing or contact pages. On general content pages, it can feel intrusive. Start with it disabled and enable it selectively where it drives the most value.

Powered-by badge

A small “Powered by Cloudax Connect” badge is shown in the widget footer by default. Toggle it off if you have the White Label add-on enabled and want the widget to look fully first-party. Without White Label the toggle is disabled.

Embedding on Your Website

Once you are happy with the preview, the Embed Centre generates a ready-to-use script tag. Copy the snippet and paste it into the <body> of any page where you want the chatbot to appear:

index.htmlHTML

<script>
  window.CloudaxWidgetConfig = {
    assistantId: "your-assistant-id",
    name: "Support Bot",
    color: "#6366f1",
    icon: "MessageCircle"
  };
</script>
<script src="https://your-domain.com/api/chatbot-widget" async></script>

The widget renders as a floating button in the bottom-right corner of the page. When a visitor clicks the button (or the page loads with auto-open enabled), the chat window expands and the conversation begins.

You can embed the same widget on multiple pages; the configuration object controls which agent is used and how the widget looks.

Standalone URL

Every chat agent also has a dedicated standalone URL at /chatbot/[assistantId]. You can share this link directly via email, social media, or QR codes (no website embedding required).

The standalone page displays a full-screen version of the chatbot with the same customisation options applied (name, icon, colour). This is especially useful for quick demos, internal testing, or situations where you want to direct someone straight to a conversation.

Share with clients

The standalone URL is a great way to let clients or stakeholders preview the chatbot before it goes live on their website. Send them the link and they can test the experience immediately.

Conversations & Handoff to Humans

Every chat conversation lands in the Omnichannel Inbox alongside voice calls. From there a human teammate can read the thread live, jump in to reply, or take the conversation off AI entirely with a single click. The visitor sees a smooth handover: the agent says it's connecting them to a teammate and the human takes over the same chat window.