Add AI Chat to your Bettermode community

Overview

You can add AI chat as a Bettermode widget to your Bettermode community.

Get an API key

Follow these steps to create an API key for your web integration.

Create App

To use the AI chat, first we need to create an application on the Bettermode platform.

Open the Bettermode Developer Portal
Click on Create a new app
Specify a name for the integration, example: Inkeep Widget
Select your community from the drop-down menu below
Click on Create app

Result:

Customizing App

Next, you need to go to the app you created and customize the widget.

Click on the Custom code section and add the following script to the Custom code for <head> area:

<script
  id="inkeep-script"
  type="module"
  src="https://cdn.jsdelivr.net/npm/@inkeep/cxkit-js@0.5/dist/embed.js"
  defer
></script>

<script defer>
  const baseConfig = {
    apiKey: "INKEEP_API_KEY", // required
    primaryBrandColor: "#26D6FF", // your brand color, widget color scheme is derived from this
    organizationDisplayName: "Inkeep",
    // ...optional settings
  };
  const inkeepScript = document.getElementById("inkeep-script");
 
  const addInkeepWidget = () => {
    const inkeepWidget = Inkeep.ChatButton({
      baseSettings: {
        ...baseConfig,
        colorMode: {
          sync: {
            target: document.body,
            attributes: ["data-color-scheme-mode"],
            isDarkMode: (attributes) =>
              attributes["data-color-scheme-mode"] === "dark",
          },
        },
      },
      modalSettings: {
        // optional
      },
      searchSettings: {
        // optional
      },
      aiChatSettings: {
        // optional
        aiAssistantAvatar: "https://mydomain.com/mylogo",
        exampleQuestions: [
          "Example question 1?",
          "Example question 2?",
          "Example question 3?",
        ],
      },
    });
  };
 
  inkeepScript.addEventListener("load", () => {
    if (document.body) {
      addInkeepWidget();
    }
  });
</script>

Click on the Test and publish section and click Publish.

Install App

Open community settings, then open the Apps section. Select the app you created.

Go back to the main community page and reload the page.