Website chat widget
A website chat widget is the small button in the corner of a site and the chat panel it opens. It is the part of a support tool your visitors see. Behind Deacon’s, an AI answers from your own content, says so when it can’t, and hands over to you. You add it with one line of code and set its colours and position against a live preview. On a phone it opens as a sheet across the screen. The free plan includes it, and no plan has a badge you pay to remove.
On every plan, including the free one.
At a glance
| What it is | A button in the corner of your site that opens a chat panel. Deacon answers in it from your content, and you can reply in it too. |
|---|---|
| Install | One script tag, loaded with async, and a list of the domains it may run on. |
| What you can change | The colours of the button, the panel, the text and the send button, the corner radius up to 32 pixels, the position and its offsets, the button’s wording and the greeting. |
| What you can’t change | The Deacon mark beside the greeting, and the panel’s fixed words such as Ask AI, which are in English. There is no dark mode. |
| On a phone | Below 640 pixels wide it opens as a full-width sheet from the bottom of the screen. |
| Your own button | Hide the floating button and call Deacon.open() from any button or link on your site. |
| Plans | The free plan and both paid ones, with the same widget on each. |
| What it isn’t | Live chat with a queue of agents. You can reply in any conversation, but nothing routes chats or shows who is online. |
How Deacon’s widget goes onto your site
Paste one line
Copy the script tag from the Install page and put it before the closing body tag. It loads with async, so your page draws first. The button sits in a closed shadow root and the chat in a frame of its own, so your styles and the widget’s can’t touch each other. The chat itself is fetched when a visitor moves to open it, and straight away for someone who had it open on the page before, so their conversation is waiting for them. If you build with Claude Code, Cursor or Codex, copy the prompt for your agent, and it adds the snippet and checks that it is live.
Make it look like your site
The Appearance editor sets the colours of the button, the panel, the text and the send button. It sets the corner radius, from square to 32 pixels over four presets, and the greeting, which can run to 300 characters. Each change shows in a live preview beside the controls. Your changes are kept as a draft, and nothing changes on your site until you press Publish. Revert to live throws the draft away.
Put it where you want it
The button can sit bottom right, bottom left or bottom centre, up to 64 pixels in from each edge, which clears a cookie banner or another floating button. What it says is yours to write, up to 24 characters. If a floating button doesn’t suit your design, hide it and open the chat from your own Help link with Deacon.open(). There are close() and toggle() calls as well, and your page can listen for deacon:open and deacon:close.
What your visitor sees
The panel opens on your greeting, with the Deacon mark beside it and a box that reads Ask AI. Answers appear as they are written, and when one comes from a page of yours, a link to the page sits under it. The conversation follows the visitor from page to page and survives a reload. On a desktop they can drag the panel out of the way. After twenty quiet minutes the conversation ends, and the next question starts a new one.
On a phone
Below 640 pixels wide the panel becomes a sheet across the full width of the screen, no taller than four fifths of it. The button keeps clear of the home bar on an iPhone. The type in the box is large enough that Safari doesn’t zoom the page when a visitor taps it.
The widget is on the free plan, with no badge to pay to remove
Install it, set your colours, and ask it the question your customers ask most. You get 50 answers a month on the free plan, and it needs no card.
What to look for in a website chat widget
Questions worth asking of any widget before it goes on your site.
Does it load after your page?
A chat widget is someone else’s script on your site. It should load with async so that your page draws first, and the chat itself should arrive when a visitor opens it. Check your page speed score before and after you add one.
Does it say who is answering?
Visitors treat a bot and a person differently. The widget should say when an AI is answering and show when a person has taken over.
What happens when nobody is there?
A live chat box with nobody behind it is worse than no chat. Look at what the widget does out of hours. It should take a message and an email address, and say plainly that a reply will come later.
Can you match it to your site without paying more?
Colours, corner radius and position should be free to change. Some tools charge to remove their badge, so check which plan that is on before you start.
Does it work on a phone?
Open your site on your own phone and start a chat. The panel should fill the screen, and the page shouldn’t zoom when you tap the box to type.
Can you open it from your own button?
A floating button suits most sites. Some designs want the chat behind a Help link in the header, or a button on the pricing page. That needs a JavaScript call the widget provides.
Does the chat survive a page change?
A visitor who asks a question and then clicks through to your pricing page should find the conversation still there.
What does it store about your visitors?
Find out which cookies it sets and for how long, and what it keeps on its own servers. You will need both for your privacy policy.
Questions about the widget
Yes. The free plan includes the widget, the Appearance editor and the dashboard. It needs no card and has no end date. A paid plan buys more of four things, the answers a month, the content Deacon holds, the pages it crawls a month and the seats on your team. See the plans
There is no “powered by” line to remove, on any plan. The Deacon mark sits beside the greeting and beside Deacon’s replies, and that stays. The default greeting says it is an AI assistant, and you can write your own.
The script loads with async, after your own page. It fetches a small loader first, and the chat panel when a visitor moves to open it. Run your page speed test before and after to see the difference on your own site.
Partly. Anyone on your team can type into a conversation from the dashboard, and as long as it hasn’t been quiet for twenty minutes, the reply appears in the chat wherever the visitor is on your site. It has no queue and no rota, so nobody is shown as online or away. How human handoff works
No. Deacon serves it and you can’t host it yourself.
No. You choose the panel’s surface colour, but the panel’s own controls are near black, so a dark surface hides them. The editor warns you if you pick one.
Put it on your own site
It takes about five minutes to install. The free plan is 50 answers a month, for as long as you like.