Embedding the AI chat in a page
Use the capabilities of the AI chat in your website. You need to embed a generated script element in the HTML source of the website.
Before you begin
You must comply with the following requirements before you embed the chat:
- A server is required to embed the chat in a website.
- The script for embedding the chat must be in the
<body>
tag and not in the<head>
tag. - An HTML element with ID root must be present in the HTML, where the chat is attached.
Procedure
Follow the steps to embed the chat to your website:
-
From the menu, click Agent configuration, and select the Embed chat tab.
-
Optional: Toggle Security to On to enable the security option to encrypt the chat data.
- Enter the public RS256 key in the Public key field. For more information, see Generating an RS256 key pair and Generating a JWT.
- Click the Generate key button to encrypt sensitive information from users. It generates a public key to encrypt the user token. For more information, see Encrypting sensitive data in web chat.
-
Copy the embed snippet.
-
Paste the snippet into your website source code, making the appropriate changes if you enabled the web chat security.
Results
The chat widget appears in your website. Now, you can test the page to ensure that you can properly interact with the chat.
You can paste the same script tag into as many pages on your website as you want. However, do not add the script more than once per page.
*.watson-orchestrate.ibm.com
URLs to ensure communication with the web chat server.Parent topic: