Problem Statement
Is there a way to automatically open the chatbot screen when a user visits the website? While I understand this can be done by customizing the Web SDK from GitHub, is it possible to achieve this using the Kore.ai hosted SDK by adding a line or two of code directly to the embedded script?
Solution
You can accomplish this by using the Kore.ai hosted SDK. Depending on the user requirements, two options are provided:
Option 1: Reload Chat Window After Closure
This option reloads the chatbot when required after the user clicks the close icon (x
).
Code Implementation:
<link rel='stylesheet' href='https://bots.kore.ai/webclient/UI/dist/kore-ai-sdk.min.css'></link>
<script src='https://bots.kore.ai/api/platform/websdkjs/a75b58xxxxxxxxxxxxxxxxxx'></script>
<script>
KoreSDK.chatConfig.minimizeMode = false; // Opens the chat window when the page loads
KoreSDK.show(KoreSDK.chatConfig);
</script>
Use Case:
Ideal when the chat window should be hidden completely after the user closes it and only reopened programmatically.
Option 2: Persistent Chat Window
This option ensures the chatbot remains visible even after the user closes it, by automatically reopening the minimized chat window.
Code Implementation:
<link rel='stylesheet' href='https://bots.kore.ai/webclient/UI/dist/kore-ai-sdk.min.css'></link>
<script src='https://bots.kore.ai/api/platform/websdkjs/a75b58xxxxxxxxxxxxxxxxxxxxxxxxxxxd26cst8d'></script>
<script>
window.addEventListener('load', (event) => {
const minimizedElement = document.querySelector('.minimized');
if (minimizedElement) {
minimizedElement.click(); // Reopens the chatbot if minimized
}
});
KoreSDK.show(KoreSDK.chatConfig);
</script>
Use Case:
Best suited for scenarios where the chat window should always remain accessible, ensuring the user sees it automatically on every page visit.
Important Notes
- These solutions work with the Kore.ai hosted SDK and do not require extensive customizations.
- Replace the script source URL (
src
) with the appropriate API key or endpoint for your chatbot instance. - Test the behavior in your environment to ensure it aligns with your desired user experience.
For further customization or queries, refer to the Kore.ai Developer Documentation
Content by @venkateswara.velidi