Skip to main content

Next.js Integration

App Router​

Create a client component:

'use client';

import Script from 'next/script';

export default function ChatWidget() {
  return (
    <Script
      src="https://cdn.webdialogai.com/widget.js"
      data-tenant-id="YOUR_TENANT_ID"
      strategy="lazyOnload"
    />
  );
}

Add to your root layout:

import ChatWidget from '@/components/ChatWidget';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <ChatWidget />
      </body>
    </html>
  );
}