How to Add an AI Chat Widget to Your Website - Live Chat, Platforms, and Rolling Your Own

# How to Add an AI Chat Widget to Your Website - Live Chat, Platforms, and Rolling Your Own

The question behind the bubble

Almost every site eventually grows a little bubble in the bottom right corner. It is one of the most copied patterns on the web, and one of the least thought about. Most teams pick a widget the way they pick a favicon: someone finds a free tier, pastes a script tag, and it stays there for three years.

That is a shame, because the bubble is doing real work. It catches the visitor who is thirty seconds from leaving, the one with a question your pricing page did not answer, the one who wants to know whether you support their stack before they sign up. Whatever sits behind it decides whether that person gets an answer or gets nothing.

There are four realistic ways to put one on a site in 2026. Which is right comes down to a single question, and it is not about budget:

Is a human going to answer, or is software?

Everything else follows from that. Get it wrong and you either pay for a support seat that idles, or you point an AI at questions it has no business answering.

---

Option 1: Live chat widgets (a human answers)

Tawk.to, Crisp, and the free tier of most helpdesk suites give you a bubble, an inbox, and a mobile app that buzzes when someone types. Tawk.to in particular is genuinely free at the level most small sites need.

What it does well:

• A real person gives real answers, including the ones that need judgement
• Excellent for high-value, low-volume conversations, where one good reply pays for itself
• Trivial to install, and the free tiers are honest rather than crippled

What to know:

• It only works while someone is watching it. An unanswered chat is worse than no chat, because the visitor asked and got silence.
• Coverage is the whole cost. Not the software, your attention.
• Timezones are brutal for a solo founder or a small team. Your visitors are awake when you are not.

Verdict: the right answer when conversations are few, valuable, and you can genuinely commit to answering them. The wrong answer the moment you find yourself typing the same reply for the fourth time this week.

---

Option 2: Roll your own

An input box, a fetch to an LLM API, a streamed response. A competent developer has a working prototype in an afternoon, and it feels like the obvious move if you already have an API key.

The prototype is not the project, though. What actually takes the time:

• Retrieval. The model does not know your product. Feeding it your docs means chunking them, embedding them, storing the vectors, and searching them well enough that the right paragraph comes back. Getting search to be merely acceptable is a week. Getting it good is longer.
• Grounding. Without a rule that says "answer only from what you retrieved", the model will confidently invent a refund policy you do not have. This is the failure that costs you a customer, and it is invisible until it happens.
• Cost control. An open text box pointed at a paid API is an open invoice. You need per-visitor rate limits before you need anything else.
• Abuse. A public endpoint that calls an LLM on demand is an attractive thing to find. Somebody will use your widget to do their homework.
• The boring half. Streaming, mobile layout, keyboard focus, screen readers, dark mode, and the CSS fight where your bubble meets a stranger's stylesheet.

If you want to understand the pieces, our write-up on running AI models locally in the browser covers the tradeoffs of client-side inference, which is a different answer to the same cost problem.

What it does well:

• Total control over the prompt, the model, and the interface
• No per-conversation pricing, you pay the model provider directly
• No third-party script on your page, which some compliance teams care about a great deal

What to know:

• The interesting part is a day. The unglamorous part is a month, and then it is yours to maintain forever.
• Every hour here is an hour not spent on the product people are actually paying for.

Verdict: worth it if the chat experience *is* your product, or if you have a hard requirement that nothing leaves your infrastructure. Otherwise you are rebuilding a solved problem.

---

Option 3: AI support platforms

Intercom's Fin, Zendesk's AI agents, and similar tools sit on top of a full helpdesk. You connect your knowledge base, the AI handles the common questions, and anything it cannot answer escalates to a human with the conversation history attached.

What it does well:

• The escalation path is the real product, and these do it properly
• Mature reporting, team inboxes, SLAs, everything a support org needs
• The AI and the humans share one system, so nothing gets lost in the handoff

What to know:

• Priced per resolution or per seat, and it climbs quickly with traffic. This is a support budget, not a tooling budget.
• It is their brand in the corner of your site. Whitelabelling is usually an enterprise line item.
• Heavy for a site that has no support team behind it. You are buying a helpdesk and using the bubble.

Verdict: correct when you have humans doing support and want AI to take the repetitive half. Oversized when the AI *is* the support.

---

Option 4: Embeddable AI widgets

The middle ground that has filled in over the last two years. You point a hosted service at your docs or your site, it handles the retrieval and the grounding, and you get a script tag. Chatbase is the best known of these. Askably is the one I built, and I should say plainly that ToolBox and Askably are both mine, so treat this section as the biased one and check it against the others.

The shape of the category:

• You add sources, a site to crawl or documents to upload, and the service indexes them
• Answers are grounded in what you gave it, so it says "I do not know" rather than inventing
• One script tag, and the bubble matches your colours and your name
• Cited answers, so the visitor can click through to the page the answer came from

What it does well:

• Days of setup instead of weeks, and no retrieval pipeline to maintain
• Answers at 3am, which is the entire point if your visitors are not in your timezone
• Predictable monthly cost rather than per-resolution pricing
• Whitelabel is normal here rather than an enterprise upsell, which matters if you are an agency putting this on a client's site

What to know:

• It is only as good as what you feed it. A thin documentation site produces a thin assistant.
• Nothing in this category replaces a human for anything involving an account, a refund, or an apology.
• Check whether you can bring your own model key. Being locked to one provider at the vendor's markup is the thing that bites eighteen months later.

Verdict: the pragmatic answer for a product with real documentation, no support team, and visitors in timezones you are asleep in.

---

The part everyone underestimates

Whichever option you pick, the assistant is downstream of your writing.

An AI widget pointed at four thin pages will produce four thin answers and a lot of hedging. The same widget pointed at documentation that actually explains the product will answer better than most first-line support, because it has read every page and never gets bored.

This is genuinely good news, because improving your docs pays twice. Once for the humans who read them, and once for the assistant that learns from them. If you are about to install a widget, spend the day before it writing the three pages you know are missing.

Two things worth doing while you are in there:

• Add structured data to your key pages, so search engines and assistants both parse them properly
• If your docs live in Markdown, preview them before publishing, since broken formatting confuses retrieval as much as it confuses readers

---

Quick decision table

---

What to measure once it is live

Installing the widget is the easy part. Two numbers tell you whether it is working:

1. The percentage of conversations that end without a follow-up question. A good assistant answers and the visitor leaves satisfied. A bad one produces three rounds of rephrasing.
2. What people actually ask. This is the most underrated output of any chat widget, AI or human. The questions arriving in that box are a live feed of what your site fails to explain. Read them weekly and fix the top three. The widget pays for itself in page edits alone.

The bubble is not really a support channel. It is the shortest path between a confused visitor and the thing you forgot to write down.