Website Widget

The website widget puts your agent on your own site as a chat and voice bubble. Visitors type or talk to the same agent that answers your phone, with the same instructions, knowledge, tools and workflows. You also get a test link: a hosted page where anyone can talk to the agent, before the widget is on your site.

You can do all of it from the app, or from Claude or ChatGPT without opening the app.

First setup

1. Turn the widget on

   Open the agent → Channels → Website Widget and switch it on. Until it is on, the test link shows This assistant isn’t available right now and the embedded widget does not load.

2. Try the test link

   Embed & share → Shareable page link → Open. The link is https://app.voicelogica.ai/w/<agent id>. Ask the agent what callers usually ask. You can also send this link to customers by email, SMS or Viber.

3. Add it to your website

   Embed & share → Add to your website → Copy. The code is two lines:

   <voice-logica-agent agent-id="<agent id>"></voice-logica-agent>
   <script src="https://api.voicelogica.ai/widget/embed.js" async type="text/javascript"></script>

   Paste it before </body> on every page. On WordPress, use a header and footer plugin and paste it in the footer field. On Wix, Shopify or Joomla, use the site’s custom code or footer scripts setting.

4. Lock it to your domain

   Allowed domains: add your site’s hostname, for example example.com. Keep Also allow www. variant on if your site also answers on www.. An empty list lets any website embed your agent and use your chat sessions.

   The test link always works, whatever this list says.

5. Make it look like your site

   Appearance sets the size, the corner of the screen, the colours and the avatar. Live preview shows the result before you save.

6. Prove it

   Open your website in a private window, open the bubble and ask a real question. The conversation shows in Calls with its transcript and call results.

Links in the agent’s replies

For safety, a link in a reply is clickable only if its domain is on the Clickable link domains list (Website Widget → Interface). Any other link shows struck through and cannot be clicked. When the list is empty, which is the default, no link is clickable.

• Add each domain the agent may link to, for example example.com and hihello.com. A domain matches exactly: example.com does not cover shop.example.com, so add that too.
• Also allow www. for these domains (on by default) lets example.com also cover www.example.com.
• Allow plain http:// links only matters for sites without https. It does not make a link clickable by itself: the domain must still be on the list.

From Claude: update_agent_settings, section widget, { "interface": { "markdownAllowedDomains": ["example.com", "hihello.com"] } }.

From Claude or ChatGPT

With Voice Logica connected, ask in plain words: “Turn on the website chat for my agent and give me the code for my site.”

• update_agent_settings with section widget and { "enabled": true } switches it on. If you give no domains, it is locked to the website on your company profile. The answer carries the test link and the embed code.
• get_agent_settings with section widget returns the same link and code, and the current settings.
• test_in_browser returns the test link and the embed code, and switches the widget on if it was off.

Domains, colours, placement and pre-chat fields change the same way, for example { "allowedDomains": ["example.com"] } or { "styling": { "placement": "bottom-left" } }.

Asking visitors who they are

Caller verification asks for an email or mobile before the chat starts and can confirm it with a code (SMS codes work for Greek and Cypriot numbers). Turn on Actions need a verified visitor when the agent can create orders, bookings or tickets: visitors who did not verify can only ask questions.

The values reach the agent as variables, so a returning customer is recognised the same way as on the phone.

Phone and chat on one agent

One agent can answer the phone and the website chat and still behave differently on each. The agent already knows when a conversation is typed: it does not get the speech-recognition and spoken-style rules there. For your own rules, use the {{serviceType}} variable in the prompt:

Conversation	{{serviceType}}
Website chat (typing), WhatsApp, Viber, Messenger, Instagram	message
Website voice (talking in the bubble)	websocket
Phone call	empty

Write the rule in plain words, for example:

The conversation type is “{{serviceType}}”. If it is “message”, the customer is typing: do not ask them to spell or repeat an email, name or number they wrote, and send links and details in the chat instead of by SMS. Otherwise they are speaking: confirm an email by reading it back, or offer to send an SMS so they can write it.

On WhatsApp, Viber, Messenger and Instagram each connection also has its own channel instructions that the agent reads only on that channel.

A person takes over

When a visitor asks for a person, the agent can hand the same chat to a teammate. That needs Transfer on the agent and Provide chat support on the teammate. See Live Support.

Billing

One chat session covers one visitor for 24 hours, however many messages, including a handover to a teammate. When none are left, new conversations are refused until you buy a chat-sessions pack. See How charges work.

The test link says the assistant isn't available

The widget is off. Switch it on in Website Widget, or ask Claude to turn it on.

The bubble does not show on my site

Check that the site’s hostname is in Allowed domains (or the list is empty), that the code is on the page you are looking at, and that a cache plugin is not serving an old copy of the page.

Can I put the same agent on two websites?

Yes. Add both hostnames to Allowed domains and paste the same code on both sites.

Can the chat show a form when the visitor asks for a person and nobody is available?

There is no form inside the chat. When the visitor asks for a person, Live Support offers the chat to a teammate who is online. If nobody takes it, the AI says so and takes the message in the same chat: it asks for the name, an email or phone, and what it is about, one question at a time. There is no new session and no pre-chat form.

To have every such message reach your team as a task, turn on Auto-create tasks in Call results. The task carries the details the visitor gave.

A link in the chat is struck through and cannot be clicked

Its domain is not on Clickable link domains. Add it there, for example hihello.com, and save. Turning on Allow plain http:// links alone does not help. See Links in the agent’s replies.