Kelu makes a website widget for you, named after your knowledge base, when you create the knowledge base. Open it, pick where your site is built, and paste the code it gives you. The platform guides have the same steps for each platform.

​
Before you start

  • A knowledge base with at least one source. It must be external: an internal knowledge base has no public surface, so it gets no widget.
  • The owner or admin role in the workspace. Only they can open and change website widgets.
  • A way to add code to every page of your site.

​
Find your widget

1

Open it

Go to Integrations → Website widget. Your widget has the same name as your knowledge base. You can also open it from the knowledge base: Integrations tab → Widget & Deflector → Open widget.
2

Check the sites it works on

On the Install tab, look at Sites it works on. A new widget has no site yet. When you add a source, Kelu fills it in for you: your company’s domain from a work email ([email protected] gives https://example.com and https://*.example.com), plus the site that source is about, such as the docs site you crawl. Kelu takes the email of the person who adds the source, else the workspace owner’s, else an admin’s, else any member’s. For the Custom Answers source made with your first answer, there is no such person, so Kelu starts with the owner’s. Personal addresses such as Gmail are skipped. After that, new sources do not change the list. Kelu does this only while the knowledge base has one widget.If it asks you to add your site’s address, type it in, for example docs.example.com, click Add, then click Save. This happens until you add a source, and when nobody in the workspace has a work email and your sources have no site, such as uploaded files.https://*.example.com covers every single-level subdomain. Testing on your own computer (localhost) always works. The public key has its own list: see Troubleshooting.
No widget yet? A knowledge base made before widgets were created automatically has none. Click New widget on the same page, pick the knowledge base, add your site and click Create. You can also make more than one widget, for example one per site.

​
Add the code to your site

On the Install tab, under Where is your site built?, pick your platform. Kelu shows the steps for it, with your widget id and key already in the code. If someone else will do it, click Copy steps for my developer. Not listed? Pick Other / plain HTML. The plain code looks like this: 
<script async src="https://widget.kelu.dev/kelu-widget.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-client-key="kl_pk_..."></script>
Paste it into the template that renders every page, in <head> or just before </body>. You only do this once.
  • data-widget-id names your widget. Its colours, text and every other setting load from the dashboard, so you can change them later without touching your site.
  • data-client-key is the widget’s public key. A key belongs to one knowledge base, so if you move the widget to another knowledge base, the key changes too. Copy the new snippet into your site.
Moving from kapa.ai? The widget reads data-website-id as data-widget-id, but the value must be your Kelu widget id. See Moving from kapa.ai.
You can also skip the widget and embed with data-knowledge-base-id instead of data-widget-id, setting every option as a data-* attribute. See Configuration.

​
Check it works

Before you paste anything, the Preview next to the settings shows the widget with your colours and text. It changes as you edit, before you save. Turn on Real answers to ask your knowledge base from the preview.
1

Reload a page

A round icon button appears in the bottom-right corner, with the tooltip Ask AI. Click it, or press Cmd+K (Ctrl+K on Windows and Linux). Esc closes the panel.
2

Ask a question

Ask something your knowledge base covers. The answer streams in, with its pages listed under Sources.
Changes you save in the dashboard show up on the next page load. An attribute on the tag always wins over the dashboard setting.

​
Troubleshooting

Open your browser’s developer tools and reload the page.
  • No button, and the console shows a CSP or network error for kelu-widget.js. The script did not load. Check that the tag is on the page. If your site has a Content Security Policy, allow the widget’s domains: see How do I fix CSP errors?. The widget never logs KeluWidget is not defined. That error comes from your own code calling KeluWidget before the script has loaded: see Preinitialize the widget.
  • No button at all, and the console says code=WIDGET_DISABLED. The widget is switched Off at the top of its page. Turn it On and click Save. While it is off, it is not shown on your site.
  • A 403 in the Network tab. The page’s site is not allowed. Check Sites it works on on the widget’s Install tab, and the public key’s own allowed origins under the knowledge base’s Integrations tab → Client Keys.
  • The console says [Kelu Widget] configuration refused for widget <id>. The line gives the status and a code. code=ORIGIN_NOT_ALLOWED: add this page’s site to Sites it works on. status=404: the widget id is wrong, or the widget belongs to a different knowledge base than the key. Until you fix it, every question fails.
  • It works on your site but not on localhost. Your public key has its own allowed origins, and localhost is not added to a key’s list automatically. A key’s list cannot be edited. Click New public key on the widget’s Advanced tab, under Name and knowledge base, save, and paste the new code into your site: the key is part of it.
  • Cmd+K opens your site’s search as well. Turn off Open with Cmd/Ctrl+K on the widget’s Search & opening tab.
  • Not sure which version loaded. Run KeluWidget.version in the console.
The widget stores a random anonymous id in the reader’s browser, so repeat visits count as one reader. If your privacy rules need consent first, see User tracking.

​
Next steps