Skip to content

Widget

What is the widget?#

The HyperHelp widget is a lightweight chat interface that you embed on your website. Visitors click a floating button, a chat panel opens, and they can ask questions about your content. Answers are sourced directly from your crawled pages and Q&A entries, with optional source citations.

The widget runs in a Shadow DOM — it won't interfere with your site's styles, and your styles won't affect it.

Installing the widget#

Add the following snippet to your website:

<script
  src="https://app.hyperhelp.ai/widget/chat.js"
  async
  onload='window.HyperhelpWidget.init({ "chatbotKey": "YOUR_WIDGET_KEY" })'
></script>
  1. Go to your chatbot's Settings > Embed & access tab.
  2. Copy the embed snippet — your widget key is already filled in.
  3. Paste it before the closing </body> tag on every page where you want the widget.
  4. That's it — the widget loads asynchronously and won't slow down your page.

Tip: You can also paste the snippet into your site's template or layout file so it appears on every page automatically.

Finding your widget key#

Your widget key is shown in Settings > Embed & access > Security key, where you can reveal and copy it. It identifies your chatbot inside the embed code, so the widget won't load without it.

The key is public by nature — anyone viewing your page source can read it. That is why the domain allowlist below is what actually protects your chatbot.

Allowed websites (domain allowlist)#

The widget only loads on the domains you list. Everywhere else the script does nothing, which is what stops someone embedding your chatbot on their own site.

Go to Settings > Embed & access > Allowed websites and add one domain per line:

example.com
docs.example.com
localhost:3000
  • Enter just the domain — no https:// needed. Paste a full URL and the extra part is removed for you.
  • Each subdomain needs its own entry. example.com does not cover docs.example.com.
  • Ports are supported for local testing, such as localhost:3000.

An empty list would leave the widget unable to load anywhere, so Save stays disabled until you add at least one domain.

Warning: Don't forget to add your production domain before going live. Without it, visitors see the widget's unavailable message instead of the chat.

Rotating your widget key#

If your widget key is compromised, use Rotate key in Settings > Embed & access. You are asked to confirm first, because the old key stops working immediately and every site still using the old snippet goes dark until you paste the new one.

What's next?#