Skip to main content
This tutorial walks through hosting the Kore.ai Widget SDK — either standalone (panels only) or co-hosted alongside the Web SDK (panels + chat window).

​
Prerequisites

  1. Build a bot with Digital Views. See Digital Views.
  2. Enable the Widget SDK channel on your bot by creating or using an existing client app. See Add Widget SDK Channel. Note the following from the Configurations tab:
    • Bot Name
    • Bot ID
    • Client ID
    • Client Secret
  3. If co-hosting with Web SDK, also enable the Web/Mobile Client channel. Note the same four credentials from that channel. See Web SDK Tutorial.
  4. Publish the bot.

​
Option A — Host Panels Standalone

  1. Download the Web SDK from github.com/Koredotcom/web-kore-sdk and extract all files to …/SDKApp/sdk.
  2. Open the UI folder and edit kore-widgets-config.js.
  3. Configure botOptions with the Widget SDK channel credentials: 
    botOptions.botInfo      = { name: "<Bot Name>", "_id": "<Bot ID>" };
botOptions.clientId     = "<Client ID>";
botOptions.clientSecret = "<Client Secret>";
  4. Open index_widgets.html in a browser. The panels render in the page.
  5. To embed panels in your own website, add the <div> element from index_widgets.html to your HTML page.

​
Option B — Co-Host Panels with Web SDK

  1. Download and extract the Web SDK to …/SDKApp/sdk (same as above).
  2. Open the UI folder and edit kore-config.js.
  3. Configure botOptions with the Web/Mobile Client channel credentials: 
    botOptions.botInfo      = { name: "<Bot Name>", "_id": "<Bot ID>" };
botOptions.clientId     = "<Web/Mobile Client ID>";
botOptions.clientSecret = "<Web/Mobile Client Secret>";
  4. Edit kore-widgets-config.js and configure botOptions with the Widget SDK channel credentials: 
    botOptions.botInfo      = { name: "<Bot Name>", "_id": "<Bot ID>" };
botOptions.clientId     = "<Widget SDK Client ID>";
botOptions.clientSecret = "<Widget SDK Client Secret>";
  5. Open index_widgets_chat.html in a browser. The chat window and panels render together.