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

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.