Embed code options
The attributes the website chat script reads, for developers adding the chat by hand.
This page is for developers. Most people can copy the code from Integrations → Website chat without changing it. See Install on your website.
The embed code
<script
src="https://chatzora.com/widget.js"
data-agent-id="YOUR_ASSISTANT_ID"
data-api-base="https://chatzora.com"
data-title="Your business name"
async
></script>Place it before the closing </body> tag on every page where the chat should appear.
Attributes
| Attribute | Required | What it does |
|---|---|---|
data-agent-id | Yes | The assistant to load. Without it the script does nothing. |
data-api-base | No | The Chatzora address to talk to. Defaults to the address the script was loaded from. |
data-title | No | Header text shown before the saved settings load. |
data-color | No | Theme color shown before the saved settings load, for example #059669. |
data-welcome-message | No | Welcome message shown before the saved settings load. |
data-launcher-text | No | Chat button text shown before the saved settings load. |
data-position | No | left or right, before the saved settings load. |
data-lead-capture | No | true to show the contact form before the saved settings load. |
data-visitor-id | No | Your own stable ID for the visitor, such as your customer ID. If you leave it out, a random ID is created and stored in the browser. |
The appearance attributes are only starting values. Once the chat loads, the settings saved in the dashboard (General → Chat window) replace them. Change appearance in the dashboard rather than in the code.
Behavior
- On screens 480 px wide or less, the chat opens full screen. On larger screens it opens as a floating window.
- Replies stream as they are written when the browser supports it. Replies that use an integration, such as a product search, arrive in one piece.
- If Websites allowed to show your chat is set, the chat only works on those exact origins.
- If website chat is turned off in the dashboard, the script removes the chat from the page.
Content Security Policy
If your site uses a Content Security Policy, allow script-src, connect-src and frame-src for your Chatzora address (https://chatzora.com). Booking pages open in a frame, so also allow your scheduling provider in frame-src if you use booking links.
Hosted chat page
You can link to or embed the hosted chat page instead of the script:
https://chatzora.com/widget?agentId=YOUR_ASSISTANT_ID