Embed the widget
One script tag puts Relay on your site, isolated from your styles in a Shadow DOM.
The whole integration is a single tag. The widget is served as a self-contained bundle and mounts itself: there is no npm package to install and no build step.
<script
src="https://your-relay-host/embed.js"
data-relay
data-relay-api="https://your-relay-host"
data-relay-bot-id="your-bot-uuid"
data-relay-variant="docked"
async
></script>data-relay-bot-id is required
Without it the loader mounts nothing and logs a warning to the console. That is deliberate: a widget with no bot to talk to would greet the visitor and then fail on their first message, which looks like a network blip to them and like nothing at all to you. Copy the snippet from your bot's page rather than typing the uuid from memory.
Attributes
| Attribute | Required | Purpose |
|---|---|---|
data-relay | Yes | Marks the tag as the widget loader |
data-relay-api | No | API origin; defaults to the script's own origin |
data-relay-bot-id | Yes | Which bot to load. No default — the widget will not mount without it |
data-relay-variant | No | docked, editorial, or operator |
Variants
| Variant | Shape |
|---|---|
docked | The familiar bubble in the corner. The default. |
editorial | Sits inline in the page, for content-led sites |
operator | A denser, support-desk presentation |
Style isolation
The widget renders inside a Shadow DOM. Your stylesheet cannot reach into it and
its styles cannot leak out, which means it will not inherit a global
box-sizing reset or have its buttons restyled by your design system.
Allowed domains
A bot only answers from origins you have allowed. Set them before you publish; otherwise anyone who views source can lift the snippet and run your bot on their own site at your cost.
Lead capture and feedback
The widget can collect visitor contact details mid-conversation, and can offer a rating on an answer. Both surface in the inbox alongside the transcript.