Start free

Agency playbooks

How to embed a calculator in WordPress, Wix, Squarespace, Webflow and HighLevel

Where to paste a calculator embed code in WordPress, Wix, Squarespace, Webflow and HighLevel funnels — plus width, mobile and speed checks.

CalcFunnel monogram

By

· · 2 min read

Key takeaways

  • Every major builder has an HTML or code block — that's where the snippet goes.
  • No plugin is needed; the calculator renders from the snippet.
  • Give the embed the full content width on mobile.
  • Always test a real submission on a phone after publishing.

Short answer: copy the one-line snippet from your calculator’s Embed code tab and paste it into your builder’s HTML block — Custom HTML in WordPress, Embed code in Wix, Code in Squarespace, Embed in Webflow, Custom JS/HTML in HighLevel. Give it full width, publish, then run a real test on your phone.

Before you paste: three checks

  1. The calculator is customised — colors, copy and action set, because the snippet carries those settings.
  2. The domain is in your plan — Free covers 1 domain, Pro 5, Business unlimited.
  3. You know where it goes — the page where the visitor asks that calculator’s question. See where to put a mortgage calculator.

WordPress (block editor)

  1. Edit the page and click + where the calculator should appear.
  2. Search for Custom HTML and add the block.
  3. Paste the snippet. Use Preview to check it.
  4. Update the page.

On the classic editor, switch to the Text tab and paste. With page builders (Elementor, Divi, Beaver Builder), use their HTML module.

Wix

  1. In the editor, click Add Elements → Embed Code → Embed HTML.
  2. Choose Code, paste the snippet and click Update.
  3. Drag the element to full content width and set a generous height.
  4. Check the mobile editor separately — Wix lays mobile out on its own.

Squarespace

  1. Edit the page, add a block and choose Code.
  2. Paste the snippet, make sure display is set to HTML, and apply.
  3. Save and view the live page (code blocks don’t always render inside the editor).

Webflow

  1. Drag an Embed element from the Add panel onto the page.
  2. Paste the snippet and save.
  3. Set the embed’s parent to 100% width. Publish to see it live.

HighLevel funnels and websites

  1. Open the funnel step in the builder.
  2. Add a Custom JS/HTML element.
  3. Paste the snippet, save and preview.

To route the leads into the same sub-account’s workflows, follow our HighLevel webhook guide.

Plain HTML sites

Paste the snippet where the calculator should appear inside your page’s main content. No script tags need to go in the head.

After publishing: the five-minute test

  • Phone test: open the page on a phone, run a calculation, submit the form.
  • Lead check: confirm the lead appears in your CalcFunnel Contacts (and your CRM if you use a webhook).
  • Width: no horizontal scrolling; the calculator fills the column.
  • Speed: run the page through PageSpeed Insights.
  • Copy: your headline, explanation, disclaimer and NMLS ID are on the page around the embed.

Common problems

  • Blank space or cut-off bottom: the builder has a fixed height; increase it or set it to auto.
  • Tiny calculator: a narrow sidebar column. Move it into the main content area.
  • Different look from the preview: your site’s global CSS may be overriding fonts inside some builders; set the font in the calculator’s style settings.

Try the calculators from this guide

#WordPress#Agencies#Conversion
CalcFunnel monogram

About CalcFunnel Editorial Desk

The CalcFunnel editorial desk is the product team behind the calculator library. We write about the maths our calculators run (and the government sources behind every statutory figure), how loan officers, real-estate agents and agencies put calculators to work on their websites, and the compliance basics that apply to lead forms in US mortgage marketing. Guides are reviewed against the same audited data pack the calculators use; when a figure changes, the guide is updated and its date changes with it. We are not a lender and nothing here is financial or legal advice.

All guides by CalcFunnel Editorial

Get the next guide in your inbox

Two useful emails a month. Unsubscribe in one click. We never sell your address — see our privacy policy.

FAQ

Questions readers ask next

Still stuck? Ask the team — we reply within one business day.

Q.01Do I need a WordPress plugin to add a mortgage calculator?
No. Paste the embed snippet into a Custom HTML block. Avoiding a plugin means nothing extra to update or secure.
Q.02Why does my embed look cut off?
The container is probably narrower or shorter than the calculator. Give the block full width and remove fixed heights set by your theme or builder.
Q.03Can I embed a calculator on Wix's free plan?
Wix lets you add an 'Embed code' element on its plans; check your plan's embed support in Wix's help center.
Q.04Where does the embed go in Squarespace?
Use a Code block. Some Squarespace plans limit code blocks, so check your plan.
Q.05How do I add a calculator to a HighLevel funnel?
Add a Custom JS/HTML element to the funnel step and paste the snippet.
Q.06Will the embed hurt my page speed?
The calculator loads in a frame after your page's own content. Place it below your headline so your main content loads first, and check with PageSpeed Insights.

Related guides

Put this into practice on your site

Embed the calculators from this guide in minutes, branded and wired to your CRM.

Start free Browse calculators
  • Free plan, no card
  • 14-day trial on Pro & Business
  • Cancel any time