Responsive Mortgage Calculator

The Responsive Mortgage Calculator is a jQuery widget and shortcode that fits into any theme, on any device, at any size. It gives your visitors a quick way to estimate their mortgage payment, and it suits real-estate agents, home-buying blogs, mortgage brokers and lenders. Add it with the “Mortgage Calculator” block in the block editor, put it in a sidebar as a widget, or use the [mortgagecalculator] or [rmc] shortcode in any page or post.

The payment is calculated in the visitor’s browser. The optional popup with the amortization schedule and chart relies on the www.mlcalc.com/mortgage-calculator/ service (see External services below).

Features

The mortgage calculator allows your website visitors to estimate their mortgage payments by entering:

• the total cost of the home,
• a down payment amount,
• an interest rate (fixed rate),
• the amortization period (mortgage term),
• and they can select a payment period, either monthly, bi-weekly, or weekly,
• nice popup summary with chart and amortization schedule.

The mortgage payment result is displayed below the form – very simply and very easy to follow. For the savvy user, a click on the information icon reveals more mortgage details…

Redesign It

There are settings to adjust the styling, a light and a dark theme, or you can remove the styling entirely and use your theme’s styling. The HTML is built with plenty of classes, so it’s easy to override the included stylesheet with your own CSS.

Plenty of Options

• Set the interest rate compounding period for your region.
• Format currencies how you want with your own symbol, ISO code and number format.
• Hide the down payment field.
• Set a default interest rate.
• Accept amortization period in months or years.
• Set a fixed payment period.
• Set available mortgage payment period options.
• Rename the input labels.
• Add your own CSS classes.

Shortcode Attributes

Use the shortcode on different pages with different field names by using shortcode attributes. They’re pretty obvious, but here’s an example:

[mortgagecalculator totalamount="Mortgage Amount"]

or use the first letter of the original labels:

[rmc ta="Mortgage Amount"]

Set input values using attributes for total amount, down payment, interest rate, and mortgage term the long way:

[mortgagecalculator total_amount_value="$250,000" down_payment_value="$50,000" interest_rate_value="3.49%" amortization_period_value="15 years"]

or using the short versions:

[rmc tav="$250,000" dpv="$50,000" irv="3.49%" apv="15 years"]

Use cases

• A payment estimator on a real-estate agent or broker website
• A “can I afford it?” tool for home-buying guides and blog posts
• A sidebar widget that stays out of the way and adapts to the theme’s width

Disclaimer

The Responsive Mortgage Calculator is for demonstration purposes only and may not reflect actual numbers for your mortgage.

External services

This plugin works without any external service. The calculation in the form is done in your visitor’s browser (and on your own server when JavaScript is off).

The optional popup with the chart and the amortization schedule uses the mortgage calculator service at mlcalc.com, operated by ARSIDIAN LLC. Nothing is sent when a page loads. A request is made only when a visitor clicks the chart icon below the result (or presses “Calculate” while “Results Popup Behaviour” is set to show the popup only). The plugin then submits a form to https://www.mlcalc.com/ that opens in a frame on your page and carries the numbers the visitor entered in the calculator: the total amount, the down payment as a percentage, the loan term in years and the interest rate, plus the currency code set in the plugin settings, the language (en) and a few fixed display flags. No names, e-mail addresses or other personal data are sent. As with any web request, mlcalc.com receives the visitor’s IP address and browser details.

• Service: MLCalc.com
• Terms of use: https://www.mlcalc.com/terms.htm
• Privacy policy: https://www.mlcalc.com/privacy.htm