🌐 Webflow how-to · 5-minute setup

Add a click-to-call button to Webflow

Give visitors a 'Call us' button on every page of your Webflow site by pasting one snippet into Footer Code and hitting Publish. No plugin, no phone numbers to rent — browser-to-browser voice plus an AI receptionist that answers visitor questions 24/7.

TL;DR: Webflow has no plugins — it has a Custom Code panel. To add WebCallHub site-wide, open Project Settings → Custom Code → Footer Code, paste one <script> tag, click Save Changes, then Publish (custom code only goes live on publish — saving alone does nothing). Heads-up: site-wide custom code requires a paid Webflow Site plan — the free .webflow.io subdomain doesn't expose Footer Code. For a single page or the free plan, drop it into a Page Settings → Before </body> field or an Embed element instead. The async script is under 30KB so it won't slow your site. See the full WebCallHub pricing or try the live demos.

Add click-to-call to Webflow in 7 steps

This is the standard, site-wide method using Webflow's Custom Code panel. Total time: about 5 minutes.

1. Get your WebCallHub snippet

Sign up free at webcallhub.com and copy your one-line embed snippet from the dashboard. It's a single <script> tag that already contains your unique siteId.

<script src="https://app.webcallhub.com/embed/widget.js" data-site-id="YOUR_SITE_ID" async></script>

2. Open Project Settings

In the Webflow Designer, click the project name (or the menu) in the top-left and choose Project Settings — the gear icon. This is where Webflow keeps site-wide custom code.

3. Go to the Custom Code tab

Open the Custom Code tab in Project Settings. You'll see two boxes: Head Code and Footer Code. WebCallHub belongs in Footer Code so it loads after your page content.

4. Paste the snippet into Footer Code

Paste your <script> tag into the Footer Code box. Webflow injects this just before the closing </body> tag on every page of your published site, which keeps it out of the critical render path.

<script src="https://app.webcallhub.com/embed/widget.js" data-site-id="YOUR_SITE_ID" async></script>

5. Click Save Changes

Click Save Changes at the bottom of the Custom Code panel. Important: saving stores the code in your project but does not put it on your live site yet.

6. Publish your site

Back in the Designer, click Publish (top-right), pick your domains, and confirm. Webflow custom code only goes live when you publish — this is the step people most often forget.

7. Test on the live site

Open your published URL (not the Designer preview) and confirm the 'Call us' button appears bottom-right on every page. Click it to place a test call. Done — no rebuild, no phone hardware.

Single page or free plan: Embed element

When you can't use Project Settings

Site-wide Footer Code needs a paid Webflow Site plan. If you're on the free .webflow.io subdomain, or you only want the button on one page (say a Contact page), use a per-page method instead:

  • Embed element: drag an Embed component onto the canvas, paste your WebCallHub <script> snippet inside, and Save. It loads wherever that element sits.
  • Page Settings → Custom Code: open the page's settings (the gear next to the page name in the Pages panel), scroll to Custom Code, and paste the snippet into the Before </body> tag box. This adds it to that single page only.
  • Either way, you still have to Publish for the change to appear on the live site.

For a button that follows visitors across the whole site, the site-wide Footer Code method on a paid plan is the cleaner choice.

Why Webflow sites add a call button

CapabilityWebCallHub on Webflow
Site-wide install✓ one snippet in Project Settings → Footer Code
Single-page install✓ Embed element or Page Settings custom code
Webflow plugin requiredNo — Webflow has no plugins, just Custom Code
Paid Site plan neededFor site-wide code, yes; per-page works on free
Goes liveOn Publish (not on Save)
Performance impactAsync script under 30KB, won't slow the site
AI receptionist 24/7✓ answers visitors after hours, hands off to humans
Lead capture for agencies✓ ideal for client marketing sites
Mobile responsive✓ works on Webflow's responsive breakpoints
Cookie-consent compatible✓ loads after consent (GDPR-first)
No phone numbers to rent✓ browser-to-browser WebRTC voice

Pricing

WebCallHub Free → Business

Free: 1 agent, basic widget, 200 min/month
Starter: 3 agents (€29/mo)
Business: 10 agents, AI receptionist, CRM sync (€99/mo)
Pro: 25 agents, branded portal, priority support (€249/mo)
All tiers: EU-hosted, GDPR-first
From €0
Free tier is permanent — perfect for solo founders and agencies. Note: WebCallHub's free tier is separate from your Webflow plan. See full WebCallHub pricing.

Frequently asked questions

Do I need a paid Webflow Site plan?

Yes — to add site-wide custom code in Project Settings → Custom Code you need a paid Webflow Site plan. The free Webflow subdomain / Starter plan doesn't expose the Footer Code field. If you're on the free plan, you can instead drop the snippet into an Embed element or a page's Before </body> field, but a paid Site plan is required for it to appear on every page.

Why isn't the call button showing up?

The most common reason is that you saved but didn't publish. In Webflow, Custom Code changes only go live after you click Publish — saving in Project Settings is not enough. Republish the site, then hard-refresh the live URL (not the Designer preview). Also confirm the snippet is in Footer Code, not Head Code, and that your siteId is correct.

Will it slow down my Webflow site?

No — the widget is a single async <script> under 30KB, served from our CDN and loaded after your page renders. It never blocks the render path, so your Webflow site's load time, Lighthouse score, and Core Web Vitals stay intact.

Can the AI receptionist answer 24/7?

Yes — the built-in AI receptionist answers visitor questions instantly, around the clock, even when your team is offline. It handles common questions about pricing, availability and services, and hands off to a human agent when one is online. Great for agency-built marketing sites that need to capture leads after hours.

Is it GDPR compliant?

Yes — WebCallHub is EU-hosted and GDPR-first. The widget respects your cookie-consent banner (including Webflow's native consent management) and only loads after the visitor accepts functional/marketing cookies, so it stays compliant out of the box.

Add click-to-call to your Webflow site in 5 minutes

Free for one agent forever. No credit card, no plugin. EU-hosted, GDPR-first.

Start free → See live demos

Related guides