Install the Message chat widget

Install the current widget with its site embed identifier and verify a complete conversation.

Use the site embed identifier

Copy your current snippet from https://app.message.com/settings/chats/installation. Replace YOUR_EMBED_ID with the data-site-id value from that snippet. It is the site’s public embed identifier, not the workspace database ID or a secret API key.

Install once in the persistent page or application shell. The bundle renders its own launcher and panel inside Shadow DOM.

Use the site embed identifier

<script async src="https://app.message.com/widget.js"
  data-site-id="YOUR_EMBED_ID"></script>

Next.js installation

Place the script in the root layout so navigating between routes does not create duplicate widgets.

Next.js installation

// app/layout.tsx
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://app.message.com/widget.js"
          data-site-id="YOUR_EMBED_ID"
          strategy="afterInteractive"
        />
      </body>
    </html>
  );
}

Verify the published installation

Test the published page in a separate browser session. Confirm widget.js loads, the launcher opens, a visitor message reaches Inbox and an agent reply returns. Test with your site’s actual content security policy, consent controls and mobile layout.

The script connects to its own origin by default. With the standard snippet, allow the relevant script and HTTPS/WSS requests to app.message.com. Check image, media and injected-style requirements separately. Do not put an agent JWT or integration secret in the page.

Identity and private data

The shipped widget does not provide a public identify, signout or userHash login API. Browser continuity and a pre-chat email are not proof of account ownership. Use the connector’s supported customer-verification flow before disclosing private order information.