Skip to content
ChatbotIQ

How to Control the Widget with JavaScript

The ChatbotIQ widget exposes a JavaScript API (window.chatbotiq) that lets you control it programmatically. Commands work even before the widget finishes loading — they’re automatically queued.

For the full method reference, see JavaScript Widget API.

Open from a custom button

Section titled “Open from a custom button”
<button onclick="window.chatbotiq('open')">
  Need help? Chat with us
</button>

Auto-open on a specific page

Section titled “Auto-open on a specific page”
if (window.location.pathname === '/pricing') {
  window.chatbotiq('open');
}

Toggle with a keyboard shortcut

Section titled “Toggle with a keyboard shortcut”
document.addEventListener('keydown', function(e) {
  if (e.ctrlKey && e.shiftKey && e.key === 'H') {
    window.chatbotiq('toggle');
  }
});

Use in React / SPA

Section titled “Use in React / SPA”
function HelpButton() {
  const openChat = () => {
    if (window.chatbotiq) {
      window.chatbotiq('open');
    }
  };


  return <button onClick={openChat}>Get Help</button>;
}

The widget uses Shadow DOM, so it won’t interfere with your app’s styles or state management.

Section titled “Related”