In-app knowledge base widget

Aha! Knowledge

The knowledge base widget brings your support content directly into your product. Customers can search articles, ask questions, and read concise AI summaries without leaving the page they are on. This helps them quickly find the answers they need and can reduce support requests while encouraging customers to rely on your documentation.The Fredwin Cycling app open to the Dashboard page with the knowledge base widget open to popular articles. There is a search bar in the widget.

Click any of the following links to skip ahead:

Overview

Workspace owners create and manage widgets in your knowledge base settings. Each widget you create connects to your knowledge base. You can decide which pages of your application the widget appears on and which articles are featured in the main widget window. This helps you share support content that matches the context your users are in.

The knowledge base widget appears as a small icon in the corner or along the side of your application. When a user opens it, they see popular links that you choose to highlight and a search bar where they can ask questions or enter keywords.

The widget uses the same search logic as your knowledge base. This means search results and AI summaries come from the same source of truth as your main knowledge base. Users can also click to open your full knowledge base in a new browser tab to access it in full screen.

Top

Add the widget code to your product

To use the widget, your development team needs to add the widget's code snippet to your application's code. Workspace owners can access the widget code in your knowledge base settings:

  1. Navigate to the User menu -> Settings -> Workspace -> Knowledge bases and select your knowledge base.

  2. Click the Widgets tab. Then, select </> Widget code.

  3. Create or select an Application.

    • If you place a widget in a single application, you can use the Default option here.

    • If you are an Aha! Ideas Advanced plan subscriber and have an in-app idea submission widget installed, you might already have applications listed here. You can use the same configuration.

    • If you place widgets in multiple applications, you might want to create a new application to use:

      1. Click the Application dropdown, then Create a new application.

      2. Give your application a Name. Then, select Create application.

  4. (Optional) Generate a JWT secret if you plan to use private knowledge base content. Copy this value to share with your development team. They will use it to sign the JSON web tokens that authenticate users.

  5. Select Copy code snippet.

  6. Share the code snippet with the team that manages your application. If your knowledge base requires SSO authentication with JWT, provide the JWT secret to them as well.

  7. Ask them to install the snippet in your application's code.

Top

Create a knowledge base widget

Workspace owners create widgets from knowledge base settings.

  1. Navigate to the User menu -> Settings -> Account -> Knowledge bases and select the knowledge base you want to create a widget for.

  2. Click the Widgets tab and click + Add widget.

  3. Enter a Name so you can recognize this widget later. Use a name that reflects where it will appear, such as "Billing app widget" or "Admin dashboard widget."

  4. Select a Color for your widget.

  5. (Optional) Check the box next to Enable widget if you want to make the widget active instantly after saving. Skip this step if you want to further customize your widget, preview it, or enable it later.

  6. Choose the Application where you want to place the widget.

  7. Click Add widget.

Top

Customize the widget

After you create a widget, configure how it behaves and how it looks. These settings help you bring the most relevant content into the right parts of your product.

Visibility and targeting

Use the visibility settings to control where and when the widget appears.

  1. In your knowledge base settings, open the Visibility section.

  2. Set Active when you are ready for the widget to appear in your application. You can switch this off at any time to hide the widget without removing the code snippet.

  3. Add one or more Target URLs where you want the widget to appear. Use full URLs for specific pages.

  4. Select the Application if you have installed the widget code on multiple applications. This setting controls which application displays the widget.

  5. (Optional) Add Collection filters so that the widget only searches and surfaces articles from selected knowledge base collections that match the context of your application. If you do not add collection filters, all content in your knowledge base will be accessible in your widget.

Design and branding

Design settings help the widget feel like a natural part of your product.

  1. In the Design section, set a clear Title. This text appears at the top of the widget (for example: "Need help?" or "Search the knowledge base").

  2. Add a short Subtitle to explain what customers can do, such as "Search articles" or "Ask a question."

  3. Choose a Branding color. Use your primary brand color or another color that stands out without distracting from core workflows.

  4. Set the Text style to light or dark, depending on your branding color.

  5. Select the widget's Position. Choose a corner (lower right or lower left), a side position, or the Custom option.

Popular links

Popular links appear when the widget first opens and provide a useful starting point for customers.

  1. In the Empty state or Popular links area, add links to key knowledge base articles.

  2. Highlight content that answers common questions, such as getting started guides, billing help, or release notes.

  3. Reorder links so the most important articles appear first.


Top

User experience

When someone uses the widget in your product, they experience a focused way to get help:

  • They click the widget trigger to open the panel.

  • They see your featured articles and can open them in a new tab if they need deeper detail.

  • They can type a question or keyword into the search bar.

    • When your knowledge base has enough context, the widget shows a condensed AI summary at the top, followed by article results.

    • If there is not enough context for an AI summary, the widget still shows traditional search results based on keyword matches.

  • They can clear the conversation to start a new question at any time.

  • If you add a custom message or link to contact support, they see this guidance after they finish a search.

Top

Authentication and access

  • Each widget creates an entry in your knowledge base's Access settings. This records how the widget authenticates requests from your application and can help you troubleshoot authentication issues.

  • You can use public access for knowledge bases that are available to anyone.

  • For private knowledge bases, configure JWT authentication. Generate a secret in your knowledge base settings and use it to sign tokens in your application code.

  • If you use both a public access method and private widgets, the widget prefers the public method. Use this when you want the same content available in and out of your product.

  • If you need the widget to show private content only, make sure you select the private widget option in your configuration.

Top

Feedback received!

Error submitting feedback, please try again later