The web chat widget is a chat bubble you drop onto any web page with a single <script> tag. Visitors chat with your AI; when a person takes over, their replies appear in the same bubble — live.
wk_…) that routes every chat to your desk. See Settings.Adding it to your site
Paste the snippet just before your closing </body> tag:
<script src="https://blz.actionbridge.io/support/widget.js" data-key="wk_your_key_here"></script>The widget loads in its own frame, so it won’t clash with your site’s styles or scripts.
Options
| Attribute | What it does |
|---|---|
data-key |
Required. Your desk’s widget key, from Settings. |
data-position |
right (default) or left — which corner the bubble sits in. |
data-offset |
Pixels from the corner (default 20). |
If your page shows a reCAPTCHA badge in the same corner, the widget automatically lifts above it so the two don’t overlap.
Using your own bubble icon
By default the launcher on your website is our teal bubble with a speech-balloon icon (💬). You can replace it with your own PNG so the widget looks like it belongs to your site. The image you upload becomes the whole button: it fills the entire 56-pixel launcher, and we no longer draw our teal circle behind it.
- Open your desk’s Settings. Go to the Web chat section and find Chat bubble icon.
- Click Upload PNG and choose your file. The preview bubble beside the button shows exactly how the launcher will look.
- Changed your mind? Reset to default puts our speech-balloon icon back.
| Image | What works |
|---|---|
| Format | PNG |
| Recommended size | Square, at least 112×112 pixels |
| Displayed size | Fills the whole launcher, 56×56 pixels |
| Shape | Set by the image itself — a transparent background is strongly recommended |
| File size | 256 KB maximum |
The launcher is drawn at 56×56 pixels, so a 112×112 (or larger) source keeps your mark sharp on high-resolution screens. A subtle shadow is added for you and follows the outline of your artwork, so there is no need to bake one into the PNG.
The icon is the only part of the launcher you can change — the colour of our default bubble isn’t configurable. In practice that matters less than it sounds: because our circle is no longer drawn behind your image, a transparent PNG means the colour visitors see is the colour of your own artwork.
What the visitor sees
- They open the bubble and leave a name, email, and first message.
- The AI answers from your knowledge, with sources, right in the chat.
- A person can take over — their reply appears in the same chat within a few seconds.
data-key everywhere the snippet is pasted.Web chat is one of three ways in — see how customers reach you, and how a ticket works once a chat starts.