How the widget works at a high level

When a user types a question in the 0xDoktor chat widget, the following happens:

The question is sent to the 0xDoktor API, associated with your tenant ID
The API performs semantic search over your knowledge base (your uploaded documents)
The top matching chunks are retrieved and passed to the language model
The model generates an answer grounded in those chunks
The answer is returned to the widget with a confidence score
If confidence is below threshold, the widget can escalate to a human agent

This entire cycle — from question sent to answer rendered — typically completes in under 2 seconds.

Embedding the widget: the script tag

Add the following to your HTML, just before </body>:

<script
  src="https://widget.0xdoktor.com/v1/widget.js"
  data-tenant="your-tenant-id"
  async
></script>

Replace your-tenant-id with the tenant identifier from your 0xDoktor admin dashboard.

The `data-tenant` attribute

The data-tenant attribute tells the widget which account to use. Each 0xDoktor customer has a unique tenant ID. The tenant determines:

Which knowledge bases are accessible
Rate limits and usage quotas
Custom branding (colors, logo, welcome message)
Which AI model and system prompt to use

The `data-kb` attribute (optional)

If your tenant has multiple knowledge bases, you can specify which one to use on a given page:

<script
  src="https://widget.0xdoktor.com/v1/widget.js"
  data-tenant="your-tenant-id"
  data-kb="your-kb-id"
  async
></script>

This is useful when you have separate knowledge bases for different product areas, languages, or user segments. A support site might use one KB for billing questions and another for technical documentation.

Where does the widget appear?

By default, the widget appears as a floating chat button in the bottom-right corner of the page. When clicked, it expands to a full chat panel.

You can customize:

Button position (bottom-right, bottom-left)
Initial greeting message
Widget color scheme to match your brand
Whether the widget opens automatically for new visitors

All customization is done through the admin dashboard — no code changes needed.

What happens if the API is unavailable?

The widget is designed to fail gracefully. If the API does not respond within the timeout window, the widget shows a friendly error message and optionally redirects users to a contact form or email address you configure. It never silently fails or shows a blank screen.

Does the widget slow down my site?

The widget script is loaded asynchronously (async attribute). It does not block your page from rendering. The widget itself is a lazy-loaded bundle that initializes only when the user interacts with it. In practice, the performance impact is negligible.

Can I use the widget in a single-page application (SPA)?

Yes. The widget script attaches to the global window object and does not depend on traditional page navigation. It works correctly in React, Vue, Angular, and any framework that runs in the browser.

For React applications specifically, you can manage the script lifecycle using useEffect to inject and remove the script tag as needed.

How Does the 0xDoktor Widget Work? Embed Script, Tenant, and Knowledge Base