Skip to content
intoCHAT

Webflow integration

Add an AI chatbot to your Webflow site

Train an agent on your Webflow pages, CMS content and documents, then add it to every page with one line in your site's footer code. Test it in the Playground before you publish.

Create your agent free

Last updated:

How intoCHAT works on Webflow

Webflow lets you add custom code to your whole site in Site settings. intoCHAT needs one script tag there, in the footer code, and the chat bubble appears on every published page. The agent answers from the content you give it, such as your Webflow pages, CMS items, PDFs and Q&A pairs, and says when it can't find the answer. Colors, avatar and welcome message are managed in intoCHAT, so you publish once and can change the agent whenever you like.

Install intoCHAT on Webflow

  1. Create and train your agent

    Sign up for intoCHAT, create an agent and add your Webflow site's address on the Knowledge tab. intoCHAT finds up to 500 pages through your sitemap and links, and you choose which ones to include.

  2. Copy the script tag

    Open the Share tab and copy the code under Bubble Chat. Your agent ID is already in it.

  3. Paste it into Footer code

    In Webflow, open Site settings and go to the Custom code tab. Paste the script into the Footer code field, not Head code, and click Save changes.

  4. Publish your site

    Custom code only goes live when you publish. Publish the site and open the live address: the chat bubble appears in the bottom corner with your Appearance settings.

The code for your Webflow footer

<script src="https://www.intochat.ai/api/embed.js" data-chatbot-id="YOUR_AGENT_ID"></script>

Paste it into Footer code, not Head code. The script adds the chat bubble to the page body as soon as it runs, so it has to load inside the body.

What the agent does on your Webflow site

  • Reads your pages and CMS content

    intoCHAT discovers pages from your sitemap and links, including CMS pages such as blog posts. You pick the pages and can exclude paths with patterns.

  • Answers from your content

    Answers come from your sources through semantic and keyword search. Built-in rules keep the agent grounded, resist prompt injection and make it say when it doesn't know.

  • Turns visitors into leads

    Ask for an email address or phone number in the chat, manually, by rules or when the AI decides. Every new lead is emailed to you, and you can export all leads as CSV.

  • Calls your own APIs

    Custom API actions let the agent query your HTTP endpoints during a chat, with bearer token, basic auth or API key authentication. Up to 25 actions per agent.

  • Fits your design

    Match colors, avatar, launcher icon, tooltip text and position to your Webflow design, or import your logo and colors from your site address.

Frequently asked questions

Which Webflow plan do I need?

Webflow lets you add site-wide custom code when the site has an active Site plan or belongs to a Core, Growth, Agency or Freelancer Workspace. intoCHAT has its own free plan with 25 messages a month, so you can try the agent first.

Does intoCHAT slow down my Webflow site?

The script is a single file that loads at the end of the page body, after your content. The chat window runs in its own iframe served by intoCHAT, so its code stays separate from your site's code.

Why can't I see the chat bubble?

Custom code only goes live when you publish, so publish after saving and check the live address. Make sure the script is in Footer code rather than Head code, because it needs the page body to exist when it runs. Also compare the agent ID in the code with the one on the Share tab.

Can I show the chat on some pages only?

Yes. Leave the site-wide footer code empty and open Page settings for each page that should have the chat. Paste the script into the Before </body> tag section under Custom code, save and publish.

Will the agent know about new CMS items?

Only once you add them. intoCHAT doesn't re-sync sources automatically, so after you publish new CMS items, add those pages on the Knowledge tab or retrain the pages that changed.

Do I need to republish Webflow when I change the agent?

No. The script only holds your agent ID. Colors, position, welcome message and knowledge load from intoCHAT on every page view, so changes show up without republishing.

See it answer from your own website

Paste your website address and chat with an agent built from your pages. It takes about a minute.

Create your agent free

Free plan, no credit card needed.