AI Chatbot: How to keep the chat window open on each page load

Pro Tips Elfsight Widgets Tips
1

Want to keep the chat window of your AI Chatbot widget open on page reload or when switching pages of your website? Our devs found a great solution!

Just add this code to the Custom JS field on the General tab of your widget’s settings and you’ll be fine:

function waitForElement(selector, root = document) {
    return new Promise((res) => {
        let i = 10;

        function check() {
            const component = root.querySelector(selector);

            if (component) {
                res(component);
            } else if (i !== 50) {
                setTimeout(check, 100);
                i++;
            }
        }

        check();
    });
}

waitForElement("[class*='eapps-ai-chatbot'] button").then((bubble) => {
    const portal = bubble.parentNode.parentNode;
    
    const openChat = () => {
        const window = portal.querySelector("[class*='window-transition__Container-sc']");
        if (!window) {
            bubble?.click();
        }
    };
    
    openChat();
});

Note: Custom JS doesn’t function in the preview mode, so you can check the result right on your website or through the Share Link


Guys, was this solution helpful? Let us know in the comments :slightly_smiling_face:

2 Likes