Open the chat widget from your own button

Set it up

1. Go to Settings > Inboxes and click Configure on your live chat inbox.
2. In the Settings tab, find Chat Bubble and turn on Hide chat bubble. The switch saves right away.
3. Keep the widget code on your site. You find it in the same tab under Widget Installation. See Embedding the widget if it is not installed yet.
4. Add a button or link that opens the chat:

<button onclick="window.deskwootWidget.open()">Contact support</button>

A link works the same way:

<a href="#" onclick="window.deskwootWidget.open(); return false;">Contact support</a>

More you can do

• window.deskwootWidget.close() closes the chat and window.deskwootWidget.toggle() opens or closes it, so one button can do both.
• window.deskwootWidget.open({ anchor: this }) lets the chat grow out of your button instead of the corner of the page. A CSS selector like "#support-button" works as the anchor too.
• window.__deskwootUnread holds the number of new replies from your team or your AI bot that arrived while the chat was closed, for a badge on your button. Opening the chat sets it back to 0. Each change also fires a deskwoot:unread event on window.
• window.deskwoot is the same object as window.deskwootWidget.

The full reference is in the widget documentation. The colors and texts of the chat itself are covered in Customizing your chat widget.

Frequently asked questions

Does hiding the bubble remove the chat from my site?

No. Only the bubble is hidden. The chat still loads and opens when your code calls open().

What if a visitor clicks before the widget has loaded?

Calls made while the widget is still starting are queued and run once it is ready. Only code that runs before the widget code itself needs a check like if (window.deskwootWidget).

Which inboxes have this setting?

Live chat (website) inboxes. Other channels have no widget, so the Chat Bubble section only shows for live chat.

Can I show the bubble on some pages and my button on others?

Hide chat bubble applies to every page that uses this inbox's widget. If you want the bubble on some pages, keep Hide chat bubble off and add your own button where you want it. The bubble and your button open the same chat.

Nothing happens when I click my button. What should I check?

Make sure the widget code is on that same page and that the button calls window.deskwootWidget.open() exactly as written, with the parentheses.

Can I show how many replies are waiting?

Yes. Read window.__deskwootUnread, or listen for the deskwoot:unread event on window, and show the number on your button.