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