Knowledge Center logo

Embed Your External Knowledge Base in Any Website or App

Add your External KB, a search widget, or individual articles directly into your website or customer portal without sending users to a separate URL.

Embedding lets you bring your External KB content to wherever your customers already are. Instead of redirecting users to a standalone help center URL, you can surface your documentation — or just a smart search box — directly inside your product, marketing site, or customer portal. Customers get answers in context, and you reduce the friction of switching between tools.

What You Can Embed

You are not limited to embedding your entire knowledge base. You can embed exactly as much or as little as fits your use case:

Full KB iframe

Embeds your entire External KB — including navigation, product hubs, and all published articles — inside an iframe on any web page. Best for a dedicated help center or support page.

Search Widget

A lightweight search box that queries your KB and displays results as an overlay or inline panel. Best for in-app contextual help, so users can search without leaving their current workflow.

Article Embed

Embeds a single article inline on any page. Best for contextual help panels, onboarding flows, or product pages where a specific article is always relevant.

Product Article List

Embeds the article index for a single product hub — showing titles and descriptions only, without the full KB shell. Best for product-specific resource pages.

Embed Types in Detail

The Full KB iframe wraps your entire External KB experience — navigation sidebar, search bar, breadcrumbs, and article content — in a single <iframe> tag. Your KB's branding, color theme, and structure all carry through automatically.

Use this option when you want to host a complete help center at a URL on your own domain (e.g., help.yourcompany.com/docs) without maintaining a separate site. The iframe is responsive and adjusts to the container it is placed in.

Generate the iframe code from External KB → Settings → Embed → Full KB iframe. Copy the generated snippet, which includes your embed token and optional height/width overrides.

Embedding the Search Widget

1
Go to External KB → Settings → Embed

Open your External KB, click Settings in the top navigation bar, and select the Embed tab from the left sidebar.

2
Select 'Search Widget'

Under the Embed Type section, click Search Widget. A live preview of the widget appears on the right side of the screen so you can see changes as you configure them.

3
Configure the widget appearance and scope

Set the following options:

  • Theme: Choose Light or Dark to match your site's design system.
  • Placeholder text: Enter the text shown inside the search input before a user types (e.g., "Search the docs…").
  • Products to search: Select one or more product hubs. The widget will only return results from the products you enable here.
  • Widget style: Choose Floating (a fixed button in the bottom-right corner) or Inline (dropped into your layout via a container element).
4
Copy the generated script tag

Once you are satisfied with the preview, click Copy Embed Code. The snippet is a single <script> tag that includes your embed token and all the configuration options you selected.

5
Paste the script tag into your website's HTML

Add the script tag to every page where you want the widget to appear, just before the closing </body> tag. The script loads asynchronously and will not block your page render.

Embed Code Example

Here is a representative embed snippet. Your actual token and product slugs will differ.

index.html
<!-- Knowledge Base Search Widget -->
<script
  src="https://kb.example.com/embed.js"
  data-kb-token="YOUR_EMBED_TOKEN"
  data-theme="light"
  data-products="slack,salesforce"
></script>

The data-products attribute accepts a comma-separated list of product slugs. Leave it out entirely to search across all products in your KB.

Always use your embed token for client-side embeds — never your API key. Embed tokens are read-only credentials scoped exclusively to public KB search and article retrieval. They cannot write data, access internal drafts, or authenticate on behalf of a user. Because they are read-only, it is safe to include them directly in front-end HTML that end users can inspect.

Customizing Embed Appearance

You do not need to modify your website's CSS to match the widget to your brand. The Embed settings panel exposes the following appearance options:

  • Primary color — sets the accent color used for buttons, links, and highlights inside the widget
  • Button label — the text shown on the floating button trigger (default: "Help")
  • Widget position — choose bottom-right, bottom-left, top-right, or top-left for the floating style
  • Border radius — controls how rounded the widget corners appear
  • Font family — inherit from your page or specify a Google Font by name

Changes you make in the Embed settings panel apply to all instances of that embed token automatically. You do not need to update the script tag in your HTML — just save the settings and the widget refreshes on the next page load for all visitors.

Frequently Asked Questions

Yes. The search widget and article embeds always enforce the same access controls you configured in your External KB. If an article is set to Restricted and the current visitor is not authenticated or not on an approved domain, that article will not appear in search results and its embed will show an access-denied message instead of the content. Public articles are visible to all visitors regardless of authentication state.

Yes. When configuring the Search Widget or Full KB iframe, you can select multiple products to include. For the Search Widget, add each product's slug to the data-products attribute as a comma-separated list. For the Full KB iframe, the product selector in the navigation sidebar is included automatically, allowing customers to switch between products within the embedded experience.

For appearance changes and product scope changes, update the settings in External KB → Settings → Embed and save. The changes propagate to all active embeds without any code change on your website. The only time you need to update the script tag itself is if you generate a new embed token — for example, if you rotate credentials for security reasons. Rotating the token invalidates the old one, so you would need to deploy the new tag.