Web widget
Embed the chat widget on your website, control how it looks, and restrict which domains may load it.
The web widget is a chat window you embed in your website. It is the default way to put an agent in front of customers and the only channel available on every plan.
Adding it to your site
- Open the agent's Widget tab.
- Configure the appearance and greeting.
- Copy the embed snippet.
- Paste it into your site's HTML, before the closing
</body>tag.
The widget loads in an isolated container, so it will not inherit or interfere with your site's styles.
Configuration
From the Widget tab you can set the greeting message, branding and colours, whether file upload is enabled, whether voice notes are enabled, and links to your privacy policy and terms.
Attachments count towards usage — see interaction counting before enabling uploads on a high-traffic site.
Allowed origins
The widget only works on domains listed in the agent's allowed origins. This is what stops someone embedding your agent on their own site and spending your allowance. If the widget does not appear on your site, this is the first thing to check.
Add every domain that should be able to load the widget, including staging domains. Requests from anywhere else are rejected.
Testing
Use Widget Sandbox in the sidebar to talk to the agent exactly as a visitor would, without embedding anything.
For developers
The widget is also available as an npm package and a CDN bundle, with a JavaScript API for opening, closing, sending messages and listening to events. See the widget SDK.
Troubleshooting
| Symptom | Likely cause |
|---|---|
| Widget does not appear | The site's domain is missing from allowed origins |
| Widget appears but never replies | Agent status is draft or inactive |
| Widget looks wrong on your site | Check the container is not inside an element with overflow: hidden |
| Uploads rejected | File type or size limit — see knowledge for supported types |