Install the widget

The SupportWire chat widget embeds a support messenger on your site. Install it with a one-line script tag, or via the npm SDK for app frameworks.

You'll need your widget slug (an app_id-style identifier) from the admin dashboard under Settings → Widgets.

Script tag (recommended)

Drop this before </body>:

<script src="https://widget.supportwire.app/loader/index.iife.js"></script>
<script>
  new SupportWireWidget({
    widgetSlug: 'YOUR_WIDGET_SLUG',
    theme: 'light',
    triggerPosition: 'bottom-right',
  });
</script>

That's it — a launcher button appears in the corner. See Configuration for all options.

npm SDK

For React, Vue, and other app frameworks, use the messenger SDK — a drop-in, Intercom-compatible API.

npm install @supportwire/messenger-js-sdk

import SupportWire from '@supportwire/messenger-js-sdk';

SupportWire({
  app_id: 'YOUR_WIDGET_SLUG',
  // optional identity:
  email: 'user@example.com',
  user_hash: 'HMAC_SIGNATURE',
});

Identifying users

Anonymous visitors work out of the box. To tie conversations to a known user and keep them secure, pass an identity with an HMAC signature — see Identity & HMAC.

Single-page apps

The loader tracks pushState/popstate, so the widget survives client-side navigation. Open state and unread count persist across route changes via localStorage.

Content Security Policy

If you enforce a CSP, allow the widget:

script-src  https://widget.supportwire.app
frame-src   https://widget.supportwire.app
connect-src https://api.supportwire.app https://widget.supportwire.app