💎 Webflow Guide

How to Add Zappiq AI Chatbot to Your Webflow Site

Use Webflow's Project Settings to add Zappiq's script globally across your entire site. Works on all Webflow plans that allow custom code publishing.

⏱ 10 minutesAll Webflow templatesGlobal or per-page

Before You Start

You need a Zappiq account and your embed script. Sign up here. Note that Webflow requires a paid hosting plan (Site plan) to publish custom code — the free Webflow plan shows a Webflow badge and doesn't support custom code on published sites.

Works with all Webflow sites — including CMS collections, ecommerce stores, and membership sites built on Webflow.

Method 1: Project Settings (Recommended — Global)

This adds Zappiq to every page of your Webflow site at once.

1

Open Project Settings

In the Webflow Designer, click the W logo in the top left to open the main menu, then click Project Settings. Or go directly from your Webflow dashboard by clicking the gear icon on your project.

2

Go to the Custom Code tab

In Project Settings, click the Custom Code tab at the top.

3

Paste in the Footer Code field

Scroll down to the Footer Code section (not the Head Code section) and paste your Zappiq script there.

Paste in Footer Code
<script src="https://cdn.zappiqai.com/widget.js" data-id="YOUR_BOT_ID" defer></script>
4

Save and Publish

Click Save Changes at the top of the Settings panel. Then go back to the Designer and click Publish to push the changes live. Custom code changes require a republish to take effect.

Method 2: Page Settings (Specific Pages Only)

If you only want the chatbot on certain pages, you can add the script at the individual page level.

1

Open Page Settings

In the Webflow Designer, click the Pages panel icon on the left. Hover over the page you want and click the gear icon to open its settings.

2

Scroll to Custom Code

In the page settings panel, scroll down to find the Before </body> tag field.

3

Paste your script and save

Paste your Zappiq script in that field and click Save. Publish your site to push it live.

Verify It's Working

After publishing, open your Webflow site in a new browser tab. The Zappiq widget should appear in the corner within a few seconds. If it doesn't appear, make sure you clicked Publish after saving — Webflow does not push changes live until you explicitly publish.

💡

Custom code doesn't preview inside the Webflow Designer canvas — you need to view the published live site to see the widget.

Frequently Asked Questions

Do I need a paid Webflow plan?

Yes. Custom code requires a Webflow Site plan. Free Webflow sites display a Webflow badge and don't support custom scripts on the published version.

Does it work with Webflow CMS pages?

Yes — including CMS collection pages and individual CMS item pages. Adding via Project Settings covers all pages including dynamic CMS pages.

Does it work with Webflow Ecommerce?

Yes — product pages, category pages, and cart pages all work. Checkout pages on Webflow Ecommerce may have some restrictions depending on your plan.

Ready to capture more leads from your website?

Start your 7-day free trial — 100 free conversations included. No credit card required.

Start Free Trial →