Skip to main content

Website Widget

The Kapa Website Widget is a powerful tool that can be seamlessly integrated into any website or documentation platform. It enables users to ask natural language questions about your product, significantly enhancing user experience by providing quick and accurate answers. The widget is highly customizable, allowing you to tailor its appearance to match your brand identity. To experience it firsthand, try our "Ask AI" widget in the bottom right corner of this page.

Website Widget

Example Deployments

Explore our showcase to see how companies like CircleCI, Prisma, and Mapbox have styled and implemented the Kapa widget to enhance their developer experience.

Getting started

Setting up the Kapa Website Widget involves these main steps:

  1. Create a new integration: Visit the Integrations tab on app.kapa.ai to create a new Website Widget integration, enable your domain, and copy its integration/website ID.

  2. Installation: Learn how to add the Kapa widget script to your webpage, with detailed instructions for various platforms.

  3. Configuration: Explore the mandatory parameters and optional styling choices to customize your widget.

For more detailed guidance, check out our tutorials on best practices for widget deployment and styling the widget like a customer help chat, which provide step-by-step instructions for common use cases and best practices.

Features

The Kapa Website Widget comes with a comprehensive set of features designed to enhance user experience:

  • AI-powered conversations: Users can have natural conversations with your documentation, getting instant answers to their questions about your product or service.

  • Search mode: Enable users to search through your documentation sources directly within the widget, providing quick access to relevant content.

  • Answer feedback: Users can provide feedback on answers through thumbs up/down buttons, helping you understand answer quality and continuously improve your AI assistant.

  • User satisfaction surveys: Collect structured feedback from users through customizable satisfaction surveys that appear after conversations.

  • Deep thinking mode: For complex queries, users can enable deep thinking mode to let Kapa analyze a broader portion of your knowledge base, resulting in more comprehensive and detailed answers.

  • Example questions: Display suggested questions to help users understand what they can ask and get started quickly.

  • Source citations: Every answer includes clickable source links, allowing users to dive deeper into the original documentation.

Advanced configuration

Once you've set up your widget, you can explore these advanced configuration options:

  • User tracking: Implement anonymous user tracking to gain valuable insights into how users interact with the widget.

  • JavaScript API: Access a comprehensive JavaScript API to programmatically control the widget, including:

    • Functions for opening, closing, and controlling widget behavior
    • Events API to monitor widget interactions and integrate with analytics tools

These configuration options help you customize the widget's behavior and gather important data to optimize user experience.