All docs

Features

Embed & Go Live

Add the widget to your app and publish it to users

Once you've configured branding, contracts, and docs, embedding the widget takes about 2 minutes. The Embed & Go Live page provides the code snippet and a one-click toggle to publish.

The embed snippet

Add a single script tag with your publishable key in the data-key attribute - the loader injects the floating widget for you:

html
<script
  id="txid-widget-script"
  src="https://app.txid.support/widget.js"
  data-key="YOUR_PUBLISHABLE_KEY"
  async>
</script>

Paste it before the closing </body> tag in your HTML. Your publishable key is shown on the Embed & Go Live page. It's safe to include in client-side code.

Next.js / React

For Next.js App Router, add the script to your root layout:

tsx
// app/layout.tsx
import Script from "next/script"

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Script
          id="txid-widget-script"
          src="https://app.txid.support/widget.js"
          data-key="YOUR_PUBLISHABLE_KEY"
          strategy="afterInteractive"
        />
      </body>
    </html>
  )
}

Going live

After adding the snippet, return to the Embed & Go Live page and click the Live toggle. The widget becomes visible to all users of your app immediately. There's no code change or redeploy needed to go live or to pause.

Embed first, go live when ready

Embedding the snippet doesn't make the widget visible to users. It just loads the code in the background. The widget is hidden until you click the Live toggle in the dashboard. This lets you embed and test internally without anything showing to users.

Pausing

Click the Live toggle again to pause the widget. It disappears from your app instantly. Use this during incidents, planned maintenance, or when you want to make significant configuration changes before re-publishing.

PreviousPreviewNext Actions