Chat widget: JavaScript API

How to control the chat widget from your page's JavaScript. Other topics: Installation, Lead capture form, Proactive messages.

window.FlutchWidget

Once the widget loads it exposes a global window.FlutchWidget object:

  • open({ text, send, view }) — open the chat. text pre-fills the input; send sends a message immediately; view is "home" or "conversation".
  • close() — minimise back to the button.
  • show() / hide() — show or hide the whole widget.
  • set({ ... }) — update settings (theme, primaryColor, …) at runtime.
  • greet({ name, identityToken }) — show the lead greeting bubble (used by the lead capture form).
  • destroy() — remove the widget from the page.
html
<button onclick="FlutchWidget.open({ view: 'conversation' })">
  Chat with us
</button>

Calls made before the widget finishes loading are queued and run once it's ready.

Events

Subscribe to widget activity with on(event, handler). It returns an unsubscribe function.

html
<script>
  const off = FlutchWidget.on("message", () => {
    console.log("visitor sent or received a message");
  });
  // later: off();
</script>

Available events: "ready", "open", "minimize", "message", "unread". Use them to wire analytics or trigger your own UI when the visitor engages.

Need help? Write to support@flutch.ai or use the support chat in the console.