Calculators / Widget
Mortgage calculator widget
Put any of our calculators on your own website for free. Choose the options, copy the code, and paste it into your page where the calculator should appear.
Preview
Widgets added with the old embed code keep working and now use the corrected calculators. Developers can also call the calculator API directly.
For real estate websites: a calculator on every listing
Put the payment calculator on each property page with that home's price already filled in. Add data-price to the embed code and have your website fill in the listing price. Buyers see their monthly payment, with taxes, insurance and HOA dues, without retyping anything.
How to fill in each listing's numbers
Your website already has each home's price, HOA dues and property taxes from the MLS. You set the calculator up once, in the template your site uses for every listing page, and it picks up those numbers on every listing after that.
- Open your listing page template. This is the one page layout your site uses for every property. On WordPress it's usually the single-property template of your IDX plugin or theme. On hosted agent websites, look for a "custom HTML" or "custom code" box on the property page, or ask your website provider's support team.
- Paste the embed code above where you want the calculator, for example under the property details.
- Replace the sample numbers with your site's listing fields. Every platform names these a little differently, so check its help pages for the price, HOA and tax fields. For example,
data-price="450000"might becomedata-price="{{listing.price}}"ordata-price="<?php echo $price; ?>". - Open a few listings to check. The calculator should show each home's own price. If a listing has no HOA, leave that field out or empty, and the calculator uses $0.
| Attribute | What to put in it | Example |
|---|---|---|
data-price | List price | 450000 or $450,000 |
data-hoa | HOA dues per month | 120 |
data-tax | Property taxes per year, in dollars | 5400 |
data-rate | Interest rate to start with, if you want to set one | 6.25 |
data-term | Loan term in years | 30 or 15 |
Buyers can still change every number. Any other field can be set with data-value- and its name from the API, such as data-value-downpayment="10". If you can't edit your template, the plain embed code still works on any page, and buyers type in the numbers themselves. The calculator is free, with no ads and no lender offers, so your buyers stay on your page.
Just want a link?
If you keep a list of resources for homebuyers, students or clients, you're welcome to link to us. Copy this into your page:
Or link straight to the calculator your readers need most, such as the mortgage payment calculator, how much house can I afford or the amortization schedule. Everything is free, with no ads, accounts or sales forms, so it's safe to share with the public.
