<!-- LLM_VERSION_INFO
FORMAT: text/markdown
CONTENT_TYPE: article
ORIGINAL_URL: https://www.kapa.ai/blog/how-to-add-an-ai-assistant-to-your-docs-in-under-1-hour
ALTERNATE_VERSION: blog/how-to-add-an-ai-assistant-to-your-docs-in-under-1-hour.html (text/html)
EXTRACTION_DATE: 2026-04-19T00:06:17.825Z

This is the markdown version with text-only content (images converted to alt-text).
For rich formatting with images, request the HTML version at: blog/how-to-add-an-ai-assistant-to-your-docs-in-under-1-hour.html
-->

# How to Add an AI Assistant to Your Docs (in Under 1 Hour)

Learn how to add an AI assistant to your documentation in under an hour using Kapa. This guide covers RAG basics, widget setup, and how to turn static docs into a 24/7 support tool.

## Overview

### What Is RAG?

As its name implies, the Retrieval-Augmented Generation (RAG) engine “augments” the capabilities of large language models (LLMs) by providing them with additional context.

Since LLMs are already trained on pre-existing data, they cannot know anything beyond unless you provide them with new information at query time. RAG uses vectorized data stored in vector databases from your documents, code bases, and other sources. It augments a user query by fetching a contextually relevant chunk of data and supplying it to the LLM as additional context.

Building your own RAG may sound simple. After all, there are plenty of SDKs and platforms that help you scaffold a RAG engine. However, the upkeep of such a system is far more complex. How do you keep information up-to-date? How do data pipelines ingest data into the system? Where will it be stored? How do you handle hallucinations, accuracy, and fine-tuning? What do you do to protect the system from unsolicited inputs and abuse? The challenges add up quickly.

And the list isn’t even exhaustive. Managing models, GPUs, and data ingestion while trying to keep up with the advancements in AI can easily become a full-time job. And by the time everything is set up, parts of the system may already be obsolete.

Luckily, you can just leave it to Kapa.

Kapa is a RAG platform that connects multiple data sources and gives users instant answers with auto-updates, superb context-awareness, and accuracy. It does not replace your documentation platform; it just augments the documentation by adding an AI assistant on top of it.

### Where Can AI Assistants Be Used?

User-facing platforms are the best place to snuggle an AI assistant. And by snuggling, I really mean that. You do not want your AI assistant in someone's face begging to be used. It should be available exactly when it’s needed.

Here are some places where it fits naturally.

| **Customer-facing** | **In-house** |
| --- | --- |
| Documentation sites, support sites, marketing pages, product website | Internal knowledge chat for support/success/GTM teams |
| Support forums | Support copilot |
| In-product, context-aware agent with user data | Sales enablement that helps answer technical questions during sales calls |
| Customer-facing MCP, which lets customers query your docs directly from their IDE | Internal MCP server that gives your team AI-powered access to all internal knowledge |
| Community channels in Slack, Discord, or forums | Technical product co-pilot that can be pinged on Slack |
| Customer wikis | Internal wikis |

Choosing the right data sources for your AI assistant is even more important than deciding where it will appear. I recommend using official API references, forums, resolved issues, and Slack/Discord discussions.

> Avoid unmoderated sources, as they could introduce low-quality answers into your AI assistant.

## Setting up Kapa

The key to working effectively with Kapa is providing it with the right data sources. Properly managed data ensures that your assistant has access to the most up-to-date and contextually relevant information.

To create sources in Kapa, you need to have source creation permissions. Owners can create and manage sources for all projects, while members with "Edit project sources" permissions can create and manage sources only for specific projects that they have access to. Members without source permissions can view sources but cannot create or modify them, and users cannot access the Kapa platform directly or manage sources at all.

Kapa uses both role-based access control (RBAC) and fine-grained permissions. You can learn more in [Roles and Permissions in Kapa](https://docs.kapa.ai/account/role-based-permissions).

To create a source, head to the [Kapa Dashboard](https://app.kapa.ai/). Select **Sources** in the left-hand pane.

## Adding a Kapa Website Widget

Adding a Kapa Website Widget is the easiest yet most powerful way to integrate an AI assistant into your website. The widget allows users to ask questions about your product, delivering instant, accurate answers and dramatically improving the UX.

To set up the Kapa Website Widget, follow these steps:

1. Head to the [Dashboard](https://app.kapa.ai/).
2. Under the **Integrations** tab, create a new website widget.
3. Enable your domain and set it live.

> Kapa supports both production and any staging domains. You can use a regex pattern for dynamic subdomains. For testing purposes, [http://localhost](http://localhost/) is enabled by default.

4. After enabling your domain, click "Copy integration ID" to get your unique `Website ID`.
5. To add the Kapa Website Widget, you need to add a script to the `<head>` section of your website.
   
```html
<script
async
src="<https://widget.kapa.ai/kapa-widget.bundle.js>"
data-website-id="YOUR_WEBSITE_ID"
data-project-name="YOUR_PROJECT_NAME"
data-project-color="#YOUR_HEX_COLOR_CODE"
data-project-logo="https://YOUR_LOGO_URL.com/logo.png"
></script>
```

6. After adding the code snippet to the `<head>` tag, make sure to replace the `YOUR_WEBSITE_ID` with `Website ID` you’ve copied from the dashboard. Update the remaining placeholder values. See the [full list of configuration options](https://docs.kapa.ai/integrations/website-widget/configuration).
   
   - `YOUR_WEBSITE_ID`: The Website ID copied in step 4 (for example, `XXX-XXX-XXX`).
   - `YOUR_PROJECT_NAME`: Shown project name (for example, `kapa.ai`).
   - `YOUR_HEX_COLOR_CODE`: Your brand's color in hexadecimal format (for example, `#000000`).
   - `https://YOUR_LOGO_URL.com/logo.png`: A direct URL to your logo.

> If your website has a Content Security Policy enabled, you'll need to whitelist the necessary domains in your CSP configuration to allow the widget to function properly. See [How Do I Fix CSP Errors?](https://docs.kapa.ai/integrations/faq#how-do-i-fix-csp-errors)

Neat! You’ve added the Kapa Website Widget! Now head to your website (make sure you’ve saved and updated the changes, and allow some time for propagation). You should see the Kapa Website Widget appear in the corner. Test it by asking specific questions to confirm it’s working as intended.

These instructions should work for the majority of platforms, though some may require additional steps or specific configuration. Kapa provides complete installation guides for platforms like:

- [Confluence](https://docs.kapa.ai/integrations/website-widget/installation/confluence) for Atlassian Confluence sites
- [Discourse](https://docs.kapa.ai/integrations/website-widget/installation/discourse) for Discourse forums
- [Docusaurus](https://docs.kapa.ai/integrations/website-widget/installation/docusaurus) for Docusaurus documentation sites
- [Framer](https://docs.kapa.ai/integrations/website-widget/installation/framer) for Framer websites
- [Freshdesk](https://docs.kapa.ai/integrations/website-widget/installation/freshdesk) for Freshdesk support portals
- [GitBook](https://docs.kapa.ai/integrations/website-widget/installation/gitbook) for GitBook documentation
- [Mintlify](https://docs.kapa.ai/integrations/website-widget/installation/mintlify) for Mintlify documentation
- [MkDocs](https://docs.kapa.ai/integrations/website-widget/installation/mkdocs) for MkDocs sites
- [Next.js](https://docs.kapa.ai/integrations/website-widget/installation/nextjs) for Next.js applications
- [Nextra](https://docs.kapa.ai/integrations/website-widget/installation/nextra) for Nextra documentation
- [ReadMe](https://docs.kapa.ai/integrations/website-widget/installation/readme-platform) for ReadMe documentation
- [Read the Docs](https://docs.kapa.ai/integrations/website-widget/installation/readthedocs) for Read the Docs sites
- [Salesforce](https://docs.kapa.ai/integrations/website-widget/installation/salesforce) for Salesforce sites
- [Sphinx](https://docs.kapa.ai/integrations/website-widget/installation/sphinx) for Sphinx documentation
- [Webflow](https://docs.kapa.ai/integrations/website-widget/installation/webflow) for Webflow websites
- [WordPress](https://docs.kapa.ai/integrations/website-widget/installation/wordpress) for WordPress sites
- [Zendesk](https://docs.kapa.ai/integrations/website-widget/installation/zendesk) for Zendesk help centers

If your platform is not listed, there’s no need to worry. The Kapa team is always happy to assist in integration. Feel free to reach out for help - [support@kapa.ai](mailto:support@kapa.ai).

The Kapa Website Widget comes with a fully-fledged suite of features designed to enhance the UX:

- **AI conversations**: Users can have natural conversations with your documentation, getting instant and accurate answers about your product or service.
- [**Search mode**](https://docs.kapa.ai/integrations/website-widget/features/search): Users can search through your documentation sources directly within the widget.
- **Answer feedback**: Users can provide feedback on answers through an upvote/downvote system. This gives you insight into answer quality.
- [**User satisfaction surveys**](https://docs.kapa.ai/integrations/website-widget/features/user-satisfaction): You can collect structured feedback from users through customizable satisfaction surveys that appear after conversations.
- **Deep thinking mode**: For complex queries, users can enable deep thinking mode to let Kapa analyze a broader portion of your knowledge base, which will result in more comprehensive and detailed answers.
- **Example questions**: This feature displays suggested questions, helping users understand what they can ask to get started.
- **Source citations**: Every answer includes clickable source links, which will allow users to dive deeper into the original documentation.
- **UI localization**: Kapa offers support for multiple interface languages, making the widget accessible internationally. See the [list of supported languages](https://docs.kapa.ai/integrations/website-widget/configuration#supported-languages).

Once you have set up the Kapa Website Widget and learned what it can do, you can explore advanced configuration with [User Tracking](https://docs.kapa.ai/integrations/website-widget/features/user-tracking) or the [JavaScript API](https://docs.kapa.ai/integrations/website-widget/javascript-api/overview) to customize it further.

## Working with Kapa

Now that you’ve set up the Kapa Website Widget, let's see what it has collected about your user queries.

Kapa's dashboard is designed to give you insights into how it delivers answers, including accuracy, source quality, and content coverage gaps.

### Conversations

In the Conversations section of the dashboard, you can review user interactions with the assistant.

This section lets you see all the conversations a user has had with the assistant. You can filter them by the integration conversation happened in, tags, time period, feedback with upvotes and downvotes, and status.

When you click on a specific conversation, which is named after its initial question, you can see the whole transcript, sources that Kapa chose when answering, where the conversation originated, and which user talked to the assistant.

### Users

You can view individual users who communicated with the assistant, along with their conversations, question count, and timestamps for their first and latest activity.

### Coverage Gaps

Coverage Gaps, one of the key features in Kapa, helps you identify areas where the assistant was unable to provide a conclusive answer.

Kapa analyzes the [uncertain answers](https://docs.kapa.ai/analytics/faq#what-does-an-uncertain-response-mean) over a selected time-frame (for example, a week, month, or a quarter) where it did not provide a satisfactory answer. It groups recurring topics that resulted in uncertain responses into clusters and creates a two-part summary:

- **Finding**: A breakdown of what users asked and why Kapa failed to provide a complete answer;
- **Recommendation**: AI-generated suggestions on how to address the identified gap by updating your documentation.

### Top Questions

Kapa helps you discover the questions your users ask most frequently. The Top Questions section displays the total number of processed conversations and organizes recurring questions into clusters, which can be sorted by:

- Weekly, monthly, or yearly volume
- Time period

### Source Analytics

In the Source Analytics tab, you can see which sources Kapa references most frequently. It shows how many times a source has been used and the total percentage of all answers it contributed to during a selected time period.

You can also view the questions linked to the given source. Every answer Kapa provides is backed by specific sections of your knowledge sources.

## Real-World Examples

Kapa is already powering user-heavy products, giving you battle-tested data and testimonials that clearly show why relying on Kapa is better than building a DIY RAG system.

Kapa delivers AI assistance for over 200 leading tech companies all over the globe.

## Next Steps and Conclusion

Kudos! By now, you’ve ingested content that Kapa can understand and added a widget to your website, giving your users a way to talk to your documentation. Implementing AI into your documentation platform works best when done one step at a time, starting small, and testing along the way.

Kapa's onboarding team can help you do just that.
