What are the two ways to add a chatbot to a Duda site?
Duda gives you two distinct code placement paths, and the right one depends on whether you want the chatbot on every page or a specific page only.
| Method | Scope | Best for | Republish required? |
|---|---|---|---|
| More → Settings → Header HTML | Every page on the site | Most businesses — chatbot available wherever visitors land | Yes |
| More → Settings → Body End HTML | Every page on the site | When using a consent management platform (loads after primary content) | Yes |
| HTML widget (drag-and-drop) | Single page or section | Landing pages, contact pages, service-specific placement | Yes |
The site-wide Header HTML path is the correct choice for most businesses. You want the chatbot available on every page — visitors land on your homepage, a blog post, or a services page, and the widget is always there. Duda's Header HTML field accepts standard <script>, <link>, and <meta> tags — a chatbot embed script drops in without any modification.
How do you add a chatbot site-wide via Header HTML?
The site-wide method injects your script into the <head> of every page automatically. This is the fastest path — one paste, one publish, done.
- 1
Open the Duda site editor
Log in to your Duda account and click into the site you want to edit. This opens the drag-and-drop editor.
- 2
Navigate to Settings
In the left-hand editor panel, click More (the three-dot icon at the bottom of the navigation). Then click Settings from the menu that appears.
- 3
Open Header HTML
Inside the Settings panel, click Header HTML. This field injects code into the <head> section of every page on the site.
- 4
Paste your chatbot script tag
Paste your full <script> tag into the Header HTML field. For Knobot, it looks like: <script src="https://www.knobot.org/widget.js" data-key="YOUR_KEY" async></script>. Replace YOUR_KEY with the key shown in your Knobot dashboard under Widget → Install.
- 5
Click Save
Save the Settings panel. The code is stored but not yet live — Duda requires a publish step before changes appear on the public site.
- 6
Republish the site
Click the Publish button in the top-right corner of the editor. Duda deploys the change within seconds. The chatbot widget will now appear on every page of your live site.
- 7
Verify on the published URL
Open your live site in a new browser tab (not the editor preview). The Duda editor sandboxes certain scripts; the published site is where you confirm the chatbot loads and responds correctly.
How do you add a chatbot to a single Duda page using the HTML widget?
The HTML widget lets you place a script directly on one page without touching the site-wide settings. The HTML widget accepts script tags and can embed third-party tools such as videos, contact forms, and chat widgets. Use this approach when you want the chatbot on a specific landing page or contact page only.
- 1
Navigate to the target page in the editor
In the Duda editor, use the Pages panel to open the page where you want the chatbot to appear.
- 2
Search for the HTML widget
Click the + (Add Widget) button or open the widget panel. Type "HTML" in the search field. The widget appears as "HTML" or "Custom HTML."
- 3
Drag the HTML widget onto the page
Drag the widget into a column or container on the page. Duda recommends placing it in a dedicated column so it can be removed cleanly if needed later.
- 4
Paste your script tag into the widget
Click the widget to open its code editor. Paste your chatbot script tag — for example, the Knobot one-liner with your data-key attribute. Click Apply or Save.
- 5
Republish the site
Click Publish. Like all Duda content changes, the HTML widget update only goes live after publishing. Open the published URL to confirm the chatbot appears.
How do you embed Knobot specifically on a Duda site?
Knobot generates a single <script> tag from the dashboard — no plugin, no app store integration, no developer involvement required. Knobot's Premium plan ($79/month) includes 10,000 chat messages per month, RAG-grounded answers (Voyage embeddings + Gemini Flash 2.5), email and webhook lead delivery, and multi-business tenancy — all on a flat rate with no per-conversation overage.
- 1
Create a Knobot account and add your business
Sign up at knobot.org. After creating your business profile, Knobot automatically scrapes your website to build the initial knowledge base using RAG (retrieval-augmented generation). No manual Q&A writing required.
- 2
Customize the widget in the Knobot dashboard
Set the primary color, welcome message, and lead-capture fields (name, email, phone) to match your brand. All customization happens in the dashboard — you never need to touch the script tag again.
- 3
Copy the embed snippet
In the Knobot dashboard, go to Widget → Install. Copy the script tag shown there. It looks like: <script src="https://www.knobot.org/widget.js" data-key="YOUR_KEY" async></script>
- 4
Add your Duda domain under Widget → Install
In the Knobot dashboard, add your exact published Duda domain (both apex and www versions) under Widget → Install. This ensures the embedded widget loads correctly on your live site.
- 5
Paste into Duda Header HTML and publish
Follow the site-wide steps above: More → Settings → Header HTML. Paste the snippet, save, then click Publish.
- 6
Test lead capture on the published site
Open your live Duda site, trigger the chatbot, and submit a test lead. Confirm the lead appears in the Knobot dashboard under Conversations.
How does Knobot work for Duda agencies managing multiple client sites?
Duda is built for agencies — its multi-site management dashboard lets one team maintain dozens of client sites from a single account. Knobot is a natural complement: multi-business tenancy is included on all paid plans, so each client gets a completely separate knowledge base, conversation inbox, and embed key.
What should you do if the chatbot does not appear on the published Duda site?
If the script is saved in Header HTML but the chat widget never appears on the live site, work through these causes in order.
How do you fix z-index conflicts between the chatbot and Duda's mobile elements?
Duda adds a sticky mobile navigation bar and a mobile menu overlay to many templates. These elements can appear above a chatbot widget's floating button if the widget's default z-index is lower. The fix is a small CSS override added through Duda's Custom Design settings.
In the Duda editor, go to Design → Custom CSS (or the site-level Custom Design panel, depending on your Duda plan) and add:
[data-knobot-widget] {
z-index: 99999 !important;
}Knobot's widget wrapper uses the data-knobot-widget attribute. The override ensures the chatbot button stays above Duda's mobile sticky elements without affecting any other part of your design. Save and republish after adding the CSS.
Does Duda's HTTPS enforcement or CSP affect chatbot scripts?
Duda enforces HTTPS on all sites, which means your chatbot vendor must serve its widget script over HTTPS as well. Any <script src="http://..."> will be blocked by the browser as mixed content — this is a browser-level rule, not a Duda restriction. Content Security Policy (CSP) headers instruct browsers to block scripts, frames, or images from unlisted sources. Standard Duda hosting does not apply a restrictive CSP, so scripts added through Header HTML load without any CSP modification.
Knobot's widget script is served from https://www.knobot.org/widget.js — fully HTTPS, compatible with all standard Duda hosting environments. If your agency uses a custom server-side proxy or CDN in front of a Duda site (an uncommon setup), verify that your proxy's CSP headers include https://www.knobot.org in the script-src directive.