Implementation & How-To· 7 min read

How to Add an AI Chatbot to a Webflow Site

Webflow has no plugin ecosystem, which makes adding a chatbot simpler than on most platforms. Here is exactly where the code goes.


Webflow is one of the easier platforms for this, precisely because it has no plugin ecosystem. There is nothing to install, nothing to keep updated, and nothing that breaks when the platform ships a change.

You paste one script tag and you are done.

The steps

  1. Get your embed code from your chatbot provider. It will look like a single <script> tag with an id attribute.
  2. In Webflow, open Site Settings.
  3. Go to the Custom Code tab.
  4. Paste the script into Footer Code, not Head Code.
  5. Save, then Publish.

That is the whole process. The widget appears on every page of the published site.

Why footer, not head

Footer Code renders immediately before the closing </body> tag. Head Code renders in <head>, before your page content exists.

A chat widget needs the page to exist before it can attach itself, and putting it in the head means it competes with your content for the browser's attention during the render that decides your loading score.

Footer is correct for essentially every chat widget.

The paid-plan requirement

Custom code needs a paid site plan. On the free webflow.io staging domain, custom code is stripped and your widget will not appear.

This catches people out regularly — the code is right, the site is published, and nothing shows. Check the plan before debugging anything else.

Adding it to one page only

Page Settings has its own Custom Code section with a Before Body tag field. Use that if you only want the widget on, say, your pricing page. Site-wide is usually the right call, though: the visitor with a question is rarely on the page you expected.

Checking it worked

Publish, open the live site in a private window, and look for the launcher. If nothing appears:

Before you install anything

Point a chatbot at your Webflow site first and see whether it answers your content properly. You can build one from your URL in about a minute, free, and decide afterwards.

Related: do you need a plugin to add a chatbot.

Frequently asked questions

Do I need a Webflow plugin?
No. Webflow has no plugin marketplace in the WordPress sense. You paste a script into Custom Code, which is simpler and avoids a dependency that can break on update.
Where exactly does the code go?
Site Settings, Custom Code, Footer Code. That places it before the closing body tag on every page, which is what a chat widget wants.
Does it work on a free Webflow site?
Custom code requires a paid site plan. On the free webflow.io staging domain, custom code does not run.
Will it slow my site down?
A well-built widget loads asynchronously after your content, so it should not affect your largest contentful paint. Check the script is async before you commit.

Keep reading

How to Add an AI Chatbot to a Webflow Site · SpideyChat