⚡ Framer Guide

How to Add Zappiq AI Chatbot to Your Framer Website

Use Framer's Custom Code feature in Site Settings to add Zappiq globally across your entire site. Works on all Framer templates and custom designs.

⏱ 10 minutesAll Framer templatesGlobal install

Before You Start

You need a Zappiq account and your embed script. Sign up here. You also need a Framer paid plan (Mini or above) to use Custom Code — the free Framer plan doesn't support custom code on published sites.

Works with all Framer designs — landing pages, multi-page sites, portfolio sites, and SaaS marketing sites built on Framer.

Step-by-Step Installation

1

Open Site Settings in Framer

In the Framer editor, click the gear icon ⚙ in the top right (or go to Site Settings from the main menu). This opens your site-wide settings panel.

2

Go to the General tab

In Site Settings, click on the General tab. Scroll down until you find the Custom Code section.

3

Paste in the End of <body> field

You'll see two fields: one for the <head> and one for the end of <body>. Paste your Zappiq script in the end of body field.

End of <body> field
<script src="https://cdn.zappiqai.com/widget.js" data-id="YOUR_BOT_ID" defer></script>
4

Save and Publish

Click Save in the settings panel. Then click Publish in the top right of the Framer editor to push your site live. Custom code changes require a publish to take effect.

Verify It's Working

After publishing, open your Framer site's live URL in a new browser tab. The Zappiq widget should appear in the corner within a few seconds. Note that custom code does not appear in Framer's canvas preview — you need to visit the published live URL to see it.

💡

If the widget doesn't appear after publishing, try a hard refresh (Ctrl+Shift+R / Cmd+Shift+R) and confirm you're viewing the live published URL, not a Framer preview link.

Frequently Asked Questions

Do I need a paid Framer plan?

Yes. Custom Code requires a Framer Mini plan or higher. The free Framer plan doesn't allow custom scripts on published sites.

Can I add it to specific pages only in Framer?

Framer's Custom Code in Site Settings applies to all pages. For per-page scripts, you can add a Code component directly on the canvas of a specific page — contact us at [email protected] if you need help with this.

Does it work with Framer CMS pages?

Yes. Since the script is added at the site level, it applies to all pages including CMS-generated pages.

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 →