How to add an AI chatbot to your website: options, costs and setup

To add an AI chatbot to your website, you either install a widget from a help desk or chatbot builder and point it at your content, or build your own on a model API behind your server. This guide compares the three routes, shows how to ground answers in your own pages, works out real costs and covers privacy rules and testing before launch.

How do you add an AI chatbot to your website?

You add an AI chatbot to your website in one of three ways: turn on the AI agent in a help desk you already use, sign up for a chatbot builder that learns from your site, or build your own widget that calls a model API from your server. The first two take an afternoon and a script tag. The third takes days of engineering and gives you full control.

Whichever route you pick, the steps are the same in outline:

1. Decide what the chatbot is for: support questions, product discovery, lead capture or booking.
2. Collect the content it should answer from.
3. Write its instructions: tone, scope, what it must never do, when to hand off.
4. Test it against real questions, including awkward ones.
5. Embed it on your site and review conversations weekly.

The purpose in step 1 decides most of the rest. A support bot needs accurate policies and a handoff to humans. A sales assistant needs product data and a way to capture contact details. A bot that tries to do everything does each job badly.

Which chatbot option is right for your website?

Pick the help desk route if you already run support through one, a builder if you want something live this week without engineering, and a custom build if the chatbot needs to act inside your product or you have strict data requirements.

Platforms like WordPress, Shopify and Webflow have app stores with chatbot plugins, which are a variant of the builder route. Our overview of no-code AI tools covers when to move from a builder to custom code.

How do you ground a chatbot in your own content?

Ground the chatbot by giving it your pages and documents as its only source of truth and instructing it to say "I don't know" when the answer isn't there. Builders do this by crawling your site and retrieving the most relevant passages for each question, then passing them to the model with the visitor's message. This is retrieval-augmented generation, and it is why a chatbot can answer from content the model was never trained on.

What to feed it:

• Help and FAQ pages, written one question per page with the answer first.
• Policies: shipping, returns, privacy, terms, warranty.
• Product or service data: names, prices, sizes, availability, if it changes rarely; a live lookup if it changes daily.
• Contact and opening hours.

What to keep out:

• Internal documents, staff notes and anything with personal data.
• Outdated pages and old blog posts that contradict current policy.
• Marketing pages full of claims you would not want quoted as fact.

Set a reminder to recrawl or re-upload whenever prices or policies change. A chatbot quoting last year's returns window is worse than no chatbot.

How do you set up a chatbot with a builder or help desk widget?

Setting up a builder or help desk chatbot takes five steps, and none of them needs code beyond pasting a snippet.

1. Add your sources. Enter your site URL or sitemap and upload policy documents. Exclude sections you don't want used.
2. Write the instructions. Most tools have a field for this. Be specific about scope and limits:

You are the assistant on brightdental.example, a dental clinic in Leeds.Answer questions about treatments, prices, opening hours and booking,using only the provided website content. If the answer isn't there, sayso and offer the phone number 0113 000 0000 or the booking page.Never give medical advice or diagnose; for pain, swelling or bleeding,tell the visitor to call the clinic or NHS 111.Keep answers under 80 words. Start the first message with:"Hi, I'm the clinic's AI assistant."

3. Test in the preview. Ask your 20 most common questions and ten awkward ones (see the testing section below).
4. Configure handoff. Connect email or live chat so the bot can pass a conversation to a person.
5. Embed. Paste the vendor's script tag into your site template, usually right before the closing </body> tag, or install the vendor's plugin. Load it on the pages where it helps, not necessarily every page.

After launch, read conversations weekly. Each wrong answer points to a missing page, an unclear instruction or a question the bot should hand off.

How do you build a custom website chatbot with an API?

A custom chatbot has three parts: a small chat widget in the browser, an endpoint on your server, and a model API call from that server with your content attached. The browser never talks to the model provider directly, because that would expose your API key to anyone who opens developer tools.

A minimal server endpoint in Python with the Anthropic SDK and FastAPI looks like this:

import anthropicfrom fastapi import FastAPIfrom pydantic import BaseModelclient = anthropic.Anthropic()  # reads ANTHROPIC_API_KEY from the environmentapp = FastAPI()SYSTEM = (    "You are the assistant on example.com. Answer only from the documents "    "provided. If the answer isn't there, say you don't know and link /contact. "    "Keep answers under 100 words.")class Chat(BaseModel):    messages: list[dict]  # [{"role": "user" | "assistant", "content": "..."}]@app.post("/api/chat")def chat(req: Chat):    question = req.messages[-1]["content"][:2000]    docs = search_docs(question)  # your retrieval: top passages from your content    response = client.messages.create(        model="claude-haiku-5-5",        max_tokens=500,        system=f"{SYSTEM}\n\n<documents>\n{docs}\n</documents>",        messages=req.messages[-10:],  # cap history to control cost    )    reply = "".join(block.text for block in response.content if block.type == "text")    return {"reply": reply}

The model ID claude-haiku-5-5 comes from Anthropic's models overview, which describes Haiku 5.5 as the fastest current model, aimed at high-volume, latency-sensitive tasks. Move to Sonnet 5.5 if answers need more reasoning. The search_docs function is where your retrieval goes; our guide to embeddings shows how to build one.

Before going live, add what the snippet leaves out: rate limiting per IP, a maximum conversation length, logging with personal data redacted, and a budget alert on your API account. Anthropic's customer support guide walks through a fuller example with tools, and our Claude API tutorial covers streaming so replies appear word by word.

How much does a website chatbot cost?

A website chatbot costs anything from a few dollars a month in model usage for a custom build to several hundred dollars a month for a busy site on a builder or help desk plan. The pricing models differ, so compare at your expected traffic.

At the time of writing (October 2026):

To estimate a custom build, multiply. Suppose each conversation has four turns, each sending about 4,000 tokens (instructions, retrieved passages and history) and receiving 300. That is 16,000 input and 1,200 output tokens per conversation:

• Haiku 5.5: about $0.0022 per conversation, roughly $2.20 per 1,000 conversations.
• Sonnet 5.5: about $0.044 per conversation, roughly $44 per 1,000 conversations.

These figures are an illustration from list prices, not a quote; your token counts will differ. Prompt caching cuts the repeated part further, since cache reads cost a fraction of the base input price. The bigger costs of a custom build are engineering time, hosting and maintenance, so for low traffic a builder is often cheaper overall.

What privacy and legal rules apply to website chatbots?

A website chatbot processes what visitors type, which often includes names, emails and order details, so data protection law applies. In the EU you also need to tell people they are talking to an AI.

• Disclose the AI. Article 50 of the EU AI Act requires systems that interact directly with people to make clear they are AI unless that is obvious, with the obligation applying from August 2, 2026. Say it in the first message.
• Update your privacy policy. Name the chatbot, the vendor, what data is stored, for how long and why.
• Sign a data processing agreement with the vendor and check where conversation data is stored and whether it is used to train models.
• Check cookies. If the widget sets non-essential cookies, load it only after consent.
• Minimize. Don't ask for data the bot doesn't need, and tell it not to request card numbers, passwords or health details.
• Set retention. Delete or anonymize transcripts after a fixed period.

Regulated sectors (health, finance, legal) need extra care: keep the bot to general information and route anything personal to staff.

How do you test a website chatbot before launch?

Test with three sets of questions: the common ones, the edge cases and the adversarial ones. Write the expected answer for each and check the bot against it after every change to its sources or instructions.

For support-specific setup, including escalation rules and the metrics to track, see our guide to building an AI customer support chatbot.

Your launch checklist

Before the chatbot goes live on your site:

• One clear purpose, written into the instructions
• Sources limited to current, public content; internal pages excluded
• Instructions cover scope, tone, limits and when to hand off
• First message says it's an AI assistant
• Privacy policy updated; data processing agreement signed; retention set
• Widget loads asynchronously; page speed checked before and after
• Test spreadsheet passes, including adversarial questions
• Budget alert or plan limit set
• Weekly conversation review on the calendar

If you build a custom chatbot with a coding agent, Orkio gives the agent an always-on box where it keeps working on the code and opens pull requests for you to review.

Frequently asked questions