How to Add Asyntai AI Chatbot to Duda

Step-by-step guide for Duda websites

Get Embed Code

Step 1: Get Your Embed Code

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

Note: The code above is just an example. You must copy your own unique embed code from your Dashboard as it contains your personal widget ID.

Step 2: Add Code to Site Settings (Recommended)

The easiest way to add the chatbot to all pages of your Duda website is through Site Settings:

  1. Log in to your Duda account and open your website editor
  2. In the left sidebar, click "More" (three dots icon)
  3. Click "Settings"
  4. Scroll down and click "Head HTML"
  5. In the "Body End HTML" field, paste your Asyntai embed code
  6. Click "Save"
  7. Click "Publish" in the top right to make your changes live

Tip: Adding code to the Body End HTML section ensures the chatbot loads after your page content, which won't affect your site's loading speed. This method automatically adds the chatbot to every page on your site.

Alternative Method 1: HTML Widget (Specific Pages)

If you want to add the chatbot to specific pages only, use the HTML widget:

  1. Open the page you want to edit in the Duda editor
  2. In the left sidebar, search for "HTML" in the widgets panel
  3. Drag and drop the HTML widget into a column or row on your page
  4. Click on the widget to edit it
  5. Paste your Asyntai embed code into the code field
  6. Click "Update"
  7. Click "Publish" to make the changes live

Note: The HTML widget allows you to embed custom code anywhere on your page. The visual placement of the widget doesn't affect where the chatbot appears - it will still show in the bottom right corner as configured.

Alternative Method 2: Developer Mode (Advanced)

For advanced users, you can use Developer Mode to add code directly to the HTML:

  1. In the Duda editor, click the Developer Mode icon in the top bar
  2. Click "Site HTML/CSS" to expand the selection
  3. Click "body-end.html" from the file list
  4. Scroll to the last line of the file
  5. Paste your Asyntai embed code on a new line
  6. Click "Save"
  7. Click "Done" to exit Developer Mode
  8. Click "Publish" to deploy your changes

Important: Developer Mode gives you direct access to your site's HTML and CSS. Make sure to only add code at the end of the body-end.html file to avoid breaking your site's functionality. Always test changes before publishing.

Step 3: Verify Installation

After publishing your changes, open your website in a new browser tab or incognito window. You should see the chat widget button in the bottom right corner. Click it to ensure it opens and functions correctly.

Not seeing the widget? Make sure you've published your site (not just saved). Clear your browser cache or view in incognito mode. Check that your code uses HTTPS (which it does by default). Open the browser console (F12) to check for any JavaScript errors.