NexaDesk

Embed Widget

Add the NexaDesk chat widget to your website

The NexaDesk chat widget is a lightweight JavaScript snippet that adds a chat bubble to your website. Visitors click it to start a conversation with your AI chatbot.

Basic Installation

Add this script tag before the closing </body> tag on every page where you want the widget to appear:

html
<script
  src="https://chats.nexadesk.ai/widget.js"
  data-chatbot-id="YOUR_CHATBOT_ID"
></script>

Replace YOUR_CHATBOT_ID with the ID from your chatbot's Embed tab in the dashboard.

Finding Your Chatbot ID

  1. Go to Chatbots in the sidebar
  2. Click on your chatbot
  3. Navigate to the Embed tab
  4. Copy the full script snippet or just the chatbot ID

Configuration Options

You can pass additional data attributes to customize the widget:

html
<script
  src="https://chats.nexadesk.ai/widget.js"
  data-chatbot-id="YOUR_CHATBOT_ID"
  data-position="bottom-right"
  data-primary-color="#10b981"
  data-welcome-message="Hi! How can I help you today?"
  data-locale="en"
></script>
AttributeDefaultDescription
data-chatbot-idRequiredYour chatbot's unique identifier
data-positionbottom-rightWidget position: bottom-right or bottom-left
data-primary-colorFrom dashboardOverride the widget accent color
data-welcome-messageFrom dashboardOverride the welcome message
data-localeenWidget UI language

Platform-Specific Guides

Use the official NexaDesk WordPress plugin for easy installation. See WordPress Integration.

  1. Go to Online Store > Themes > Edit Code
  2. Open theme.liquid
  3. Paste the script before </body>
  4. Save

  1. Go to Settings > Custom Code
  2. Click Add Custom Code
  3. Paste the script
  4. Set placement to Body - End
  5. Apply to All Pages

Add the script using the Next.js Script component:

tsx
import Script from "next/script";

export default function Layout({ children }) {
  return (
    <>
      {children}
      <Script
        src="https://chats.nexadesk.ai/widget.js"
        data-chatbot-id="YOUR_CHATBOT_ID"
        strategy="lazyOnload"
      />
    </>
  );
}

Verifying the Installation

After adding the widget:

  1. Visit your website in a browser
  2. Look for the chat bubble in the bottom-right corner
  3. Click it and send a test message
  4. Check the Conversations tab in NexaDesk to confirm it appears