Embedding Your Agent
Add the website widget, an inline frame, or the Chat API
Embedding Your Agent#
Put the agent where customers already are. Copy the website code from the dashboard. Do not retype it.
Private checks in Playground and Agent Studio → Test do not publish website chat. Customers reach it after the channel is on, the install code is on the site, and AI Auto-Reply is on. Saving the look does not do those steps.
| Option | Where customers see it | Start here |
|---|---|---|
| Floating chat | A bubble or a bar on your site | Deploy → Chat widget or Chat bar → Install |
| Inline chat | A panel inside a page | Inline chat (iframe) on the same Install tab |
| Help Page | A standalone page you can share | Deploy → Help Page |
| Chat API | Your own app | Project Settings → API Keys and Deploy → API |
| Other channels | Messenger, Instagram, WhatsApp, and the rest | Channels |
Floating chat#
Chat widget is a floating bubble. Chat bar is a bar on the page. Turning one on replaces the other. Both use the same install code.
- Open Deploy and find On your website.
- Turn Chat widget or Chat bar on. Confirm the switch if the other one is already on.
- Choose Manage to edit that look, then Save changes.
- Open Install and copy the code shown there. Until the channel is on, Install does not show the code.
- Paste it on the site. The manual guide on Install covers a custom site, Wix, and theme fallbacks. Shopify and WordPress can also connect from Platform installs without editing the theme.
- Turn AI Auto-Reply on only when the agent should answer. Off means the chat stays silent. AlonChat can keep auto-reply off until the agent is ready for live replies.
Copy the snippet from Install. Do not retype it from this page.
| Tab | What you set |
|---|---|
| Content | Name, initial message, suggestions, notices, and the lead-capture shortcut |
| Style | Colors, light or dark, text size, and the bubble or bar |
| AI | Whether website chat follows Guidance or its own writing style |
| Install | Embed code, allowed domains, and identity verification |
Calling appears only when website voice is available. Widget setup covers the controls. Lead capture covers the form. The lead card opens Collect Lead. It does not enable the form. A lead is saved when the form is submitted, not when someone opens chat.
Where the code goes#
| Site | Where |
|---|---|
| WordPress or Shopify | Platform installs on Install, or the theme fallback in the manual guide |
| Wix | The manual guide on Install: custom code at the end of the body, then publish |
| Other HTML | The end of the body, using the current snippet |
Turn on Allowed domains when the embed should load only on your domains. Add hosts such as example.com or *.example.com, without http://. Allowed domains save as you edit them. If the list is empty, the code can load on any site that has it.
Identity verification identifies a signed-in website user. It is on Install for the floating script. Save settings once to create the secret, and keep that secret on your server.
Inline chat#
On Install, copy Inline chat (iframe) and paste it where the panel should sit. Give it enough height to use, including on a phone. It does not include the floating launcher or website identity verification.
The initial message, colors, and lead form still come from the chat editor, not from extra URL parameters.
Chat API#
Use the API when you build your own chat screen. Create a key in Project Settings → API Keys. The agent endpoint is also on Deploy → API. Call it from your server only.
curl -X POST https://alonchat.com/api/v1/chat/{agentId} \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"message": "How much does shipping cost?"
}'
The full request and response fields are in the Chat API. Keys are shown once and look like sk-….
Before you publish#
- Match the color and initial message to the business.
- Put the bubble on the right unless that side is already taken. The bar can sit left, center, or right.
- Use Auto-show popup only on pages where people expect help.
- Say in your privacy notice that the chat uses an AI agent, and collect only the lead fields you need.
- Send one real message on the published page and read it in Activity → Inbox.