Webflow

Add chatbot embed code to Webflow

Add the widget script to Webflow site settings for every page or to page settings for a single page.

Webflow

Before you start

Best for

Marketing sites, SaaS websites, landing pages, portfolios, and client websites built in Webflow.

Install location

Use Site settings, Custom code, Footer code for all pages. Use page custom code before body only when the chatbot should appear on one page.

Webflow snippet

<script
  src="https://your-domain.com/widget.js"
  data-workspace-id="WORKSPACE_ID"
  data-chatbot-id="CHATBOT_ID"
  defer
></script>

Install

1Copy the widget snippetOpen the chatbot Embed page and copy the script for the chatbot you want to publish.
2Open Webflow custom codeGo to Site settings, open Custom code, and find the Footer code field.
3Paste in Footer codePaste the full script so Webflow outputs it before the closing body tag.
4Save and publishSave changes, publish the Webflow site, then test the live custom domain.

Access

Add the custom Webflow domain used by visitors.

Add the webflow.io staging domain if you need to test there.

Keep old staging domains out of the allowlist after launch.

Verify

Custom code may not fully run inside the Designer. Verify on the published site.

If the widget appears on only one page, move the snippet from page settings to Site settings.

Footer code is preferred for this script because it keeps the page content loading first.

Next doc

Install the chatbot launcher on a Shopify storefront by adding the script to the active theme.