# Open AI chatbot when someone clicks a button

**URL:** <https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538>\
**Category:** Customization\
**Tags:** ai-chatbot\
**Created:** [February 20, 2025, 3:32pm UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538 "2025-02-20T15:32:08Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mario123](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/mario123/32/35269_2.png) [@Mario123](https://community.elfsight.com/u/Mario123)\
**Post date:** [February 20, 2025, 3:32pm UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538/1 "2025-02-20T15:32:08Z")

</div>

I have a button on my website (click to open chatbot). Is it possible that I can link this to the AI chatbot, so when someone clicks on the chatbot button the AI chatbot automatically opens? Which code do I need to add to get this done? 🙂

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [February 20, 2025, 5:30pm UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538/3 "2025-02-20T17:30:15Z")

</div>

Hi @Mario123 👋

I’ve checked your website and couldn’t find the button with this text there. Could you please send me a screenshot of this button?

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [February 21, 2025, 11:45am UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538/5 "2025-02-21T11:45:36Z")

</div>

Thank you!

We’ve added this code to the Custom JS field on the General tab of your widget’s settings:

```auto
const triggerBtn = document.querySelector('.button.is-icon.keesicon');

triggerBtn?.addEventListener('click', (e) => {
  e.preventDefault();
  e.stopImmediatePropagation();

  const chatWindow = document.querySelector(
    '[class*="widget-window__MessagesContainer-sc"]'
  );

  if (!chatWindow) {
    const openChatBtn = document.querySelector(
      '[class*="eapps-ai-chatbot"] [class*="FloatingButtonContainer-sc"] button'
    );

    openChatBtn?.click();
  }
});

```

  

Please check your website and let me know if you like how it works 🙂

---

<div class="post-metadata">

**Author:** ![Mario123](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/mario123/32/35269_2.png) [@Mario123](https://community.elfsight.com/u/Mario123)\
**Post date:** [February 21, 2025, 11:59am UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538/6 "2025-02-21T11:59:26Z")

</div>

Thanks!! It works!

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [February 21, 2025, 12:15pm UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538/7 "2025-02-21T12:15:35Z")

</div>

Great, you’re always welcome 😉

---

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [April 4, 2025, 10:26am UTC](https://community.elfsight.com/t/open-ai-chatbot-when-someone-clicks-a-button/102538/9 "2025-04-04T10:26:24Z")

</div>

A post was split to a new topic: [How to open AI Chatbot on the Button widget click](https://community.elfsight.com/t/how-to-open-ai-chatbot-on-the-button-widget-click/111494)