How to add an AI customer support agent to your website

Adding AI support should not begin with a large knowledge-management project. For an independent developer or a small team, the useful first milestone is simpler: answer repetitive questions from content you already maintain, while keeping unusual cases visible to a person.

This guide shows the complete Bubblo workflow without assuming that every page is ready or that every conversation should be automated.

Bubblo scopes this setup to an organization. The organization owns its Knowledge, Actions, Inbox conversations, and one Widget channel, while a stateless AI runtime loads those resources for each turn. There is no separate Agent resource to create or select.

1. Start with a focused knowledge source

Choose the organization for the website, then open Harness → Knowledge. Start with a page that already answers a meaningful group of questions, such as pricing, returns, installation, or account access. A focused source is easier to review than an entire site and gives you a clear test set for the first launch.

Bubblo accepts three kinds of knowledge:

• A public web page. A full page URL is fetched as one draft source.
• A site root. Bubblo can discover up to 200 URLs from its sitemap; you then choose and scrape the pages you need.
• A PDF, DOCX, Markdown, or plain-text file up to 20 MB, or content written directly in the dashboard.

New content is saved as a draft first. Review the extracted text, correct anything unclear, and select Index. The organization’s AI uses the source only after its status becomes Indexed. This review step is important: support automation is only as trustworthy as the material behind it.

For the detailed workflow, follow the Knowledge guide.

2. Install one script on your site

Open Integrations → Widget and copy the generated install code at the top of the page. It has this form:

<script src="https://cdn.bubblo.ai/widget.js" cid="YOUR_CHANNEL_ID"></script>

Place it immediately before the closing </body> tag in your shared page layout and publish the site. Load the script only once. The public cid identifies the organization’s only Widget channel, so copy the Widget CID from the dashboard instead of inventing a value. You can install that channel on multiple pages of the same website.

The current supported installation method is the script tag. The installation guide includes verification steps and troubleshooting links.

3. Make the first conversation feel intentional

Before inviting real visitors, use the appearance form below the install code on Integrations → Widget. You can choose the widget color and corner, then edit the assistant name, greeting, suggested questions, and input placeholder for each enabled language.

Start with two or three suggested questions that your indexed source can answer reliably. They help visitors understand the widget’s scope and give your team a repeatable launch test. Save the changes, then reload the published site—the preview updates immediately, but the live widget changes only after saving.

4. Test the full support loop

Do not stop after confirming that the chat bubble appears. Test the workflow from both sides:

1. Ask a question whose answer is present in the indexed source.
2. Confirm that the conversation appears in the same organization’s Inbox.
3. Turn on Take over and send a human reply.
4. Turn takeover off and confirm that the conversation can return to AI handling.
5. Resolve the conversation when no further reply is needed.

Human takeover is an explicit control: it pauses AI replies while a teammate owns the conversation. It is not an automatic promise that a person is always online. The Inbox guide explains the three conversation states and how handoff works.

A small, credible first launch

Before sending meaningful traffic to the widget, check that:

• The highest-volume questions have an indexed, current source.
• Suggested questions match what the organization’s AI can actually answer.
• A teammate knows where Needs human conversations appear.
• The widget works on mobile and does not cover an important site control.
• Your privacy notice reflects the visitor information your support flow collects.

The goal of the first release is not to automate every edge case. It is to remove repetitive work, make common answers available immediately, and give the remaining conversations a clear route to your team.

When you are ready, use the Quick Start guide as the operational checklist or open the dashboard.