Install widget

Install the DGbot widget on any website or web app with a single script tag.

Script tag (standard)

The simplest install. Add this snippet before on any HTML page:

<script
  src="https://dgbot.dgtech.co.in/static/widget.js"
  data-chatbot-id="YOUR_CHATBOT_ID"
  defer
></script>

Replace YOUR_CHATBOT_ID with the ID from Deploy → Embed widget in your admin panel.

The defer attribute ensures the widget loads after your page content — it never blocks rendering.

React / Next.js

Use the next/script component in Next.js, or a useEffect in React:

Next.js (recommended):

import Script from 'next/script'

export default function Layout({ children }) {
  return (
    <>
      {children}
      <Script
        src="https://dgbot.dgtech.co.in/static/widget.js"
        data-chatbot-id="YOUR_CHATBOT_ID"
        strategy="afterInteractive"
      />
    </>
  )
}

React (useEffect):

import { useEffect } from 'react'

function App() {
  useEffect(() => {
    const script = document.createElement('script')
    script.src = 'https://dgbot.dgtech.co.in/static/widget.js'
    script.setAttribute('data-chatbot-id', 'YOUR_CHATBOT_ID')
    script.defer = true
    document.body.appendChild(script)
    return () => document.body.removeChild(script)
  }, [])

  return <div>...</div>
}

Single-page apps

In a single-page app (SPA), the widget initialises once on first load and persists across route changes — this is the correct behaviour. You don't need to re-initialise the widget on navigation.

To control the widget programmatically across routes (e.g., close it when the user navigates to a checkout page), use the JavaScript API:

// Close the widget when navigating to checkout
window.DGbot('close')

See the JS API & events guide for the full API reference.

Content Security Policy

If your website uses a Content Security Policy (CSP), add these directives to allow the DGbot widget:

script-src 'self' https://dgbot.dgtech.co.in;
connect-src 'self' https://dgbot.dgtech.co.in wss://dgbot.dgtech.co.in;
frame-src 'self' https://dgbot.dgtech.co.in;

If you've configured a custom domain, replace dgbot.dgtech.co.in with your custom domain in all three directives.