Built for the US market · prices in USD30 live calculators
English
Sign in
InsuranceQuoteWidget
Start free

By line of business

Life

Health

Medicare

Disability & LTC

Annuities

P&C

Auto

Business

Specialty

Help · WordPress

Add your calculator to WordPress

WordPress's block editor has a Custom HTML block that takes the embed code as it is. No plugin is needed. The main things that go wrong are optimisation settings that delay scripts and hosted plans that strip them.

Start freeAll platforms

To embed a calculator in WordPress, edit the page in the block editor, add a Custom HTML block where the calculator should appear, paste the code from your account's Embed tab, then preview and update the page. The inline embed renders in an isolated container, so your WordPress theme's styles won't distort it.

How it works, step by step

How it works, step by step

  1. Copy the code from your Embed tab

    In your account, open the calculator or widget, choose the Inline mode and copy the code.

  2. Open the page in the block editor

    In WordPress, go to Pages, open the page you want (for example your life insurance page) and click where the calculator should sit.

  3. Add a Custom HTML block

    Click the plus (+) inserter, search for 'Custom HTML' and add the block. Avoid the Paragraph or Code blocks — they display code as text instead of running it.

  4. Paste the embed code

    Paste the code into the block exactly as copied. Use the block's Preview toggle to check it, but expect some setups to show the calculator only on the real page.

  5. Update and view the live page

    Click Update (or Publish), then open the page in a private browser window. The calculator should load within the content width of your theme.

  6. Submit a test lead

    Complete the calculator, submit the form and confirm the lead appears in your contacts and at your webhook destination.

Where your embed code goes

<!-- Paste the embed code from your account's Embed tab here -->

Common pitfalls

  • Pasting into a Paragraph or Code block — the code shows as text. It must be a Custom HTML block.
  • Script-delay or 'combine JavaScript' settings in a caching or optimisation plugin — exclude the embed script, or the calculator may load only after a scroll or not at all.
  • Hosted WordPress plans that don't allow scripts in content — the block saves but the script is stripped. Use the iframe mode or a direct link, or a plan that permits custom code.
  • Classic editor's Visual tab rewriting the code — switch to the Text tab before pasting.
  • Placing the calculator in a narrow sidebar widget — give it the full content column on mobile.
  • Testing only while logged in — check the page logged out too, since some caches serve a different version to visitors.

Which WordPress pages should carry a calculator?

Put each calculator on the product page for its line: the life insurance calculator on your life page, the HSA comparison on your benefits page, the annuity calculators on your retirement-income page. These pages already attract people researching that product, and a calculator gives them a reason to share their numbers instead of leaving.

If you publish blog posts on coverage questions, a popup button inside the relevant post is a lighter option than a full inline calculator. Browse the calculators by line to match one to each page.

What if my theme uses a page builder instead of blocks?

Most WordPress page builders include an HTML or custom code element that behaves like the Custom HTML block. Drag that element into your layout, paste the same embed code and publish. If the builder's preview stays blank, check the published page — builders often skip outside scripts while you edit.

Avoid putting the code in a text or heading element; those encode the characters and the script never runs.

How do I show a floating bubble on every WordPress page?

Copy the floating bubble code from the Embed tab and add it to an area that loads on every page, such as a footer widget area that accepts custom HTML, or your theme's footer through a code-insertion setting. Keep it to one placement so the bubble doesn't appear twice on the same page.

A bubble that holds a multi-calculator widget lets visitors choose their line from any page. See multi-calculator widgets.

All platforms

WixSquarespaceWebflowShopifyHighLevelHTML

FAQ

Questions agencies ask

Answers first, details after.

Do I need a WordPress plugin to embed the calculator?

No. The block editor's Custom HTML block is all you need. Installing a plugin just to hold one script adds maintenance without benefit. If your theme uses a page builder, its own HTML element works the same way.

Why does the Custom HTML block preview look empty?

The editor doesn't always run outside scripts. Update the page and view the published version in a private window. If it's blank there too, check whether an optimisation setting is delaying or combining scripts, and exclude the embed script from it.

Will my WordPress theme's CSS change the calculator's look?

No. The inline embed renders in an isolated container, so theme styles don't leak in and the calculator's styles don't leak out. Match the calculator to your brand with its own theme, palette and font settings in your account.

My hosted WordPress plan removes the script when I save. What can I do?

Some hosted plans don't allow scripts in page content. Use the inline-in-a-frame or classic iframe mode if frames are permitted, or link a button to the calculator's direct link. Upgrading to a plan that allows custom code also solves it.

Can I use the same calculator on several WordPress pages?

Yes. Paste the same code into each page. Every lead records the page URL it came from, so you can see which placement works. If two pages should route to different HighLevel workflows, use separate calculators with their own webhooks.

Does the calculator work with WordPress caching?

Yes — page caching is fine because the calculator loads in the browser. Problems come from settings that delay, defer or merge JavaScript. If the calculator appears late or not at all, exclude the embed script from those optimisations and clear the cache.

Can I embed a Spanish-language calculator on my Spanish pages?

Yes. The calculator runs in 2 languages and visitors can switch. On a Spanish page, set the embed's language to Spanish so it opens that way, and make sure your consent wording is translated too.

InsuranceQuoteWidget

Your WordPress page is one block away

Copy the code from your Embed tab, add a Custom HTML block and send yourself a test lead. If something blocks the script, tell us your setup and we'll suggest a mode that works.

Start freeCompare plans

Free Producer plan · 14-day trial on paid plans · cancel any time

Start freePricing