How to Add a Mortgage Calculator in WordPress

Looking to add a WordPress mortgage calculator to your site? You don't need a dedicated mortgage loan calculator plugin for WordPress.

You can create your own custom loan calculator that perfectly matches your needs. This is one of many ways to use calculators on your WordPress site.

Better yet, Formidable Forms includes pre-built WordPress mortgage calculator templates, so you don't need to set up your form from scratch (though you can if you want!). You're also able to customize the templates to meet your needs and even hook them up to your CRM or email marketing service to generate leads from your calculator.

Formidable Forms is the best WordPress Form Builder plugin. Get it for free!

In this post, you'll learn how to use Formidable Forms to create your own mortgage loan calculator on WordPress like the example below:

Let's dig in...

How to create a WordPress mortgage calculator

To create a real estate mortgage calculator on WordPress with Formidable Forms, you'll need at least the Formidable Forms Basic plan, which gets you access to the Calculator Forms feature. This turns Formidable into a powerful WordPress calculator plugin. Then you can perform calculations on number fields to generate the final mortgage payment based on user input.

However, if you want to take advantage of the pre-made mortgage calculator form templates, you'll need the Business plan to access them.

We'll start by showing you the quickest way to build a WordPress mortgage calculator by using those pre-made templates. Then, we'll show you how to manually build your custom calculator, which you can do with the Basic plan and a little extra math.

How to import a mortgage loan calculator template

To import a pre-built mortgage calculator on the Formidable Forms Business plan or above, go to Formidable → Add New and filter the templates by "Calculator". There, you'll see a number of different mortgage calculator templates including:

There's also a separate Mortgage Application Form template, which might come in handy if you want to include the calculator as part of a broader application.

Once you import your chosen template, you can customize it as needed and remove or add fields.

You can also add lead generation features to your calculator. For example, you could ask visitors to enter their name and email address to use the calculator and then sync those details with MailChimp, GetResponse, and other CRMs:

Then, you can display the calculator on the front-end of your site using the Formidable Forms block or shortcode.

And that's it! Within a few clicks, you have a working real estate mortgage calculator on WordPress.

👉 Learn more: How to Create a Calculator in WordPress

How to create your own mortgage calculator on WordPress

If you're using the Formidable Forms Basic plan, or if you just prefer to build your loan calculator from scratch, you can set up your own calculator using number fields and a math formula.

We'll show you how to do this to create a simple mortgage form, but the same basic principles apply to more complex forms (the math just gets a little more complex!).

To get started, you'll need to go to Formidable → Add New to create a blank form. Then, follow these instructions...

1. Add three Number fields to collect user inputs

First, you want to add three Number fields to collect a person's:

Mortgage amount
Interest rate
Mortgage period (you can also use a Slider field here to make it more user-friendly, which is what the Simple Mortgage Calculator template uses).

For each field, make sure to set the number range. For example, for the mortgage period, you'd probably want to cap it at 30 years. You should also set up a default value to help visitors understand roughly what value should go in each field:

2. Create a calculator total field

Once you've added your three input fields, you need to add another Number field that will show a person's monthly payment based on the input fields.

In the new Number field that you just added, go to the Advanced tab and turn on the Calculator option next to Default Value. Then, enter the formula for your calculator as the field's default value.

You can include the values from your input fields by adding the field ID inside brackets (if you click on the icon marked in the screenshot below, it will show you the field IDs for all the fields on your form):

Here's the formula for a simple mortgage calculator - you'll just need to match the field IDs with the IDs from your own form:

[89] * ([90] / 1200) / (1 - (Math.pow(1/(1 + ([90] / 1200)), ([91]*12))))

👉 Learn more: Best WordPress Calculator Plugins

3. Add additional fields as needed

With just the first two steps, you already have a working mortgage calculator.

If you'd like, though, you can add some extra fields to collect information from people using your calculator. For example, fields to collect basic lead information like a person's name and email address.

You can then set up integrations to automatically sync those details to your CRM or email marketing software.

Once you're finished, add the form to the front-end of your site using the Formidable Forms block or shortcode.

And remember - if you feel overwhelmed trying to set up these mathematical calculations by yourself, Formidable Forms includes pre-built templates for both simple and advanced mortgage calculators.