Flocci Chat Start free
Plain answer

How to add an AI chatbot to WordPress, Shopify, Webflow, Wix and more

Short answer

Every one of these platforms accepts a custom script tag, so installing an AI chatbot is the same job everywhere: paste one snippet into the site-wide footer or custom-code area, publish, and reload. With Flocci Chat the widget then learns the site itself — including builder pages that render through JavaScript, where crawler-only chatbots see nothing.

The snippet (identical on every platform)

<script
  src="https://chat.flocci.in/widget.js"
  data-key="fch_live_your_widget_key"
  data-api="https://chat.flocci.in"
  async defer
></script>

Create a workspace at chat.flocci.in to generate your own data-key. The bundle is served with a five-minute cache, so widget improvements reach your site automatically with no action from you.

WordPress

Appearance → Theme File Editor → footer.php, immediately before </body>. On block themes or if you'd rather not touch theme files, use any "insert headers and footers" plugin and paste into the footer field. Both routes put the tag on every page, which is what you want — the widget only learns pages that visitors actually open.

Shopify

Online Store → Themes → Edit code → layout/theme.liquid, before the closing </body> tag. Product, collection and policy pages are then all covered. Pair it with an agentic action against your order-status endpoint so verified customers can ask "where is my order" and get a live answer — see chatbots that take actions.

Webflow

Project settings → Custom code → Footer code, then republish. Webflow's CMS collection pages are rendered before the widget reads them, so blog posts and dynamic collection items enter the knowledge base exactly as visitors see them.

Wix and Squarespace

Wix: Settings → Custom code → Add custom code → paste, apply to all pages, place in Body – end. Squarespace: Settings → Advanced → Code injection → Footer. Both platforms render substantial page content through JavaScript, which is precisely the case where a crawl-only chatbot trainer under-indexes a site and a rendered-DOM reader does not.

Framer

Project settings → General → Custom code → End of <body> tag. Framer sites are heavily client-rendered; passive learning covers them page by page as visitors browse.

Next.js, React, Vue and other SPAs

Render the tag once in your root layout (app/layout.tsx, pages/_app.tsx, index.html or the equivalent). The widget re-reads the DOM on client-side route changes, so every virtual route is learned without a full page load. On authenticated screens add data-passive-ingest="off" so private in-app content never enters the knowledge base. Background: AI chatbots for React and SPA websites.

Plain HTML, Hugo, Jekyll, Astro, PHP

Paste it into whatever partial produces the closing body tag of every page — footer.html, base.html, Layout.astro, your PHP footer include. Static sites are the easiest case: the crawler and the rendered DOM agree completely.

After you install: a three-minute checklist

  1. Reload the site — the launcher should appear in the corner and be draggable to any edge.
  2. Browse five key pages yourself; each is learned as it renders.
  3. Ask the widget a question those pages answer — expect a cited reply.
  4. Ask something your site never covers — expect a clarifying question or an offer to reach a human, not an invented answer.
  5. Check the dashboard's unanswered-intent list after a week; it is the most honest content-gap report your site will ever get.

Frequently asked questions

Do I need a plugin to add an AI chatbot to WordPress?

No. Paste the script tag into footer.php before the closing body tag, or use any headers-and-footers plugin if you prefer not to edit theme files. There is nothing WordPress-specific about the widget.

Where do I put a chatbot script in Shopify?

Online Store → Themes → Edit code → layout/theme.liquid, immediately before the closing </body> tag. That covers product, collection, cart and policy pages in one edit.

Will the chatbot read my Webflow CMS or Wix dynamic pages?

Yes, if it reads rendered pages. Flocci Chat's widget indexes each page after JavaScript runs, so CMS collection items and dynamic builder sections are captured as visitors see them. A server-side crawler may miss them entirely.

Does the chatbot widget slow down my site?

It loads with async and defer, renders inside a Shadow DOM so it cannot clash with your theme's CSS, and fails silently if anything goes wrong — it never blocks rendering or logs noise into your console.

Can I hide the chatbot on certain pages?

Yes. Include the tag only where you want the widget, and use data-passive-ingest="off" on logged-in or private surfaces so those pages are never learned even where the widget is present.

Try it on your own website

One script tag. 500 free credits — roughly 500 answered visitor messages. Every feature on, no card. The widget in the corner of this page is the product, running on its own site.

Create your workspace — free