Tutorial
How to Add a Mortgage Calculator to Wix
Add a working mortgage calculator to any Wix page in under 3 minutes. The widget loads inside an iframe and updates results as users type.
Before you start
Wix Free and Combo plans do not allow custom iframe HTML on published sites. You need Wix Premium (Connect Domain plan, $27/month) or higher to publish embedded code. The Wix Editor does allow HTML elements on all paid plans.
Step-by-step
- 1
Open Wix Editor and the target page
Log in at wix.com, go to your site dashboard, and click Edit Site. From the top bar, use the Pages menu (left side) to select the page where you want the calculator. The Wix Editor opens in visual mode.
- 2
Add an Embed > Custom Embed element
In the left sidebar, click the + Add Elements button. Choose Embed & Social from the list, then click Embed Code (sometimes labeled Custom Embed). A dashed placeholder box appears on the page — drag it to where you want the calculator.
- 3
Paste the iframe code
Click Change Code (or Edit Code) in the placeholder. Choose Code from the options. Paste the embed code below, click Apply, then Apply again. The placeholder now represents the calculator.
- 4
Resize and preview
Drag the corner handles of the placeholder to set the width and height. Wix respects the height you set here, not the height in the iframe HTML. For a full-width layout, drag the box to the page edge. Click Preview (top-right) to test.
- 5
Publish and check mobile
Click Publish (top-right). Then click the Mobile icon in the Editor toolbar and verify the calculator fits in the mobile viewport. Use the Mobile Editor to adjust width and position separately if needed.
The embed code
Copy this exactly. It works on Wix and every other supported platform.
<iframe src="https://calcpier.com/embed/mortgage-calculator/" width="100%" height="900" style="border:0;border-radius:12px;max-width:900px" title="Mortgage Calculator by CalcPier" loading="lazy"></iframe>
<p style="font-size:12px;color:#666;text-align:center;margin-top:8px">Calculator by <a href="https://calcpier.com/">CalcPier</a> - free financial tools for US homebuyers.</p>Sidebar or narrow layout
For narrow Wix containers, drag the placeholder to 400px wide. Height should be increased to 1100 to accommodate the stacked layout.
<iframe src="https://calcpier.com/embed/mortgage-calculator/" width="100%" height="1100" style="border:0;border-radius:12px;max-width:400px" title="Mortgage Calculator by CalcPier" loading="lazy"></iframe>
<p style="font-size:12px;color:#666;text-align:center;margin-top:8px">Calculator by <a href="https://calcpier.com/">CalcPier</a> - free financial tools for US homebuyers.</p>Frequently asked questions
Does the calculator work on Wix free plan?
No. Wix Free plan does not allow publishing custom HTML or iframes. You need Wix Premium (Connect Domain, $27/month) or higher. The Wix Editor will show the element but block publishing until you upgrade.
Will the calculator slow down my Wix site?
No. The iframe uses loading="lazy", so browsers only load the calculator when the user scrolls near it. The widget itself is HTML + CSS + 15 KB of JavaScript — lighter than most Wix native elements.
Can I add the calculator to a Wix blog post?
Yes. Open the Wix Blog Editor, click + in the post body, choose Embed > Embed Code, and paste the iframe. Blog posts support embeds on Wix Premium plans just like pages do.
How do I set the calculator width?
Wix uses the visual placeholder size, not the iframe HTML width. Drag the box to your desired width. For sidebar layouts, 400-500px works well; for content widths, match your text column (typically 700-900px).
Can I remove the attribution footer?
No. The "Powered by CalcPier" link must remain visible. It is part of the widget and cannot be hidden with CSS inside the iframe (cross-origin policy prevents it). Wrapping the iframe in a way that crops out the footer violates the terms.
Is the calculator free for commercial Wix sites?
Yes. Free for commercial and non-commercial use. The only requirement is keeping the attribution link visible at the bottom of the widget.