Looking to create a WordPress calculator? You totally can - and with the right tools, it's easy. Here’s how to add a calculator to your WordPress site.
Approximate read-time: 7.5 minutes
When you think about calculators, what comes to mind? Nightmares of tax season? Flashbacks to a high school math exam? If you associate calculators with grueling math-based tasks, you aren't alone.
But we've got some good news: calculators are not to be feared. In fact, if you have a WordPress website, calculators could become your new best friend!
There are virtually endless ways to make online calculators work for your website. We'll give you some ideas below first. Then, we'll show you how to make your own calculator in just a few easy steps.
Why would you need a calculator on your site?
Let’s say you run a real estate business. One of the most helpful things you can offer your customers is a website calculator.
Whether people want to know their monthly payment, how much they need to save, or if they’re ready to buy a house, you can provide a free calculator for them to use.
And this is true for almost all industries!
If you’re a physical trainer, you can offer a weight-loss calculator. If you run a financial website, you can help people calculate their monthly finances.
Even bloggers can make use of calculators. For example, if you run a mommy blog, you can create an online calculator that tells expecting moms how many days are left until their baby arrives.
Using a calculator is good for your website because it’s good for your visitors. Your job is to serve them. And a custom calculator for your website is a great way to do that.
Plus, you can collect users’ email addresses for email marketing and selling purposes. All you need to do is calibrate your calculator for lead generation and you are set!
So really — why wouldn't you use a calculator on your WordPress site?
Read More: 6 Ways to Use Calculators on WordPress Sites
What is the best calculator plugin?
It's a very common scenario. While developing your WordPress site, you run into a snag. If you can't solve the problem yourself, you download a plugin.
In this case, your site might need a cost calculator. And behold! Among a sea of WordPress plugins, you'll find calculator plugins a-plenty. Problem solved, right?
Wrong!
This is something we talk about a lot at Formidable. If your goal is a fast WordPress site, then you need to minimize the number of plugins you have installed.
WordPress plugins are both a blessing and a curse. On one hand, it's great to have so many options to extend your site. On the other, too many plugins can slow your site down and cause site-breaking conflicts.
If not a calculator plugin, then what?
So if you agree that too many plugins is a 'no-no', then what should you do? Learn to code? Hire a developer? What's the solution here?
It's simple: one plugin to rule them all!
To create a calculator in WordPress, you don’t need to know how to code. All you need is a great WordPress form plugin.
A drag and drop form builder with a variety of field types has everything you need to create a calculator and much more. Cost estimation calculators, quote calculators, loan calculators - whatever! A form plugin can do that. Also, it has many advanced options that you'll find useful.
What's more, a form plugin can create contact forms, order forms for eCommerce price calculators, and tons of other things for your website. Formidable can do everything a WordPress calculator plugin can do - plus more.
How to add a WordPress calculator using a template
Before we take you through our step-by-step guide, let's talk about time-saving templates. Formidable Forms (our great form plugin) has tons of templates so you can quickly and easily add and customize calculators on your site.
We have a long list of calculator templates, but a few of them include:
- Simple Mortgage Calculator
- Length Conversion Calculator Form Template
- Savings and Investment Calculator Form Template
- Debt to Income Ratio Calculator
- Daily Calorie Intake Calculator Template
- Pregnancy Due Date Calculator Form Template
As you can see, we have enough calculators to cover a variety of industries. Your visitors can calculate the price of your product, do credit card or mortgage-related calculations, find out car loan information, and more.
So no matter what business you have, there’s probably a quick calculator template for your site. All you need is our plugin!
Note: Calculator templates are unlocked with our premium plans.
Download the Formidable Forms plugin
Here’s how to add the Formidable Forms plugin:
- From your WordPress dashboard, go to the Plugins page.
- Search "Formidable Forms" and download our plugin.
- To activate the plugin, follow the installation instructions in the docs.
After connecting, you’ll see a success message. Refresh the page and you’ll be able to see the premium features.
Create and customize your calculator
Next, you can go to Formidable → Add New. This will show a list of our calculator templates, which you can manually scroll through or you can use the search box to find the template you need.
Once you find the calculator template you want, you can preview it by hitting the Preview button, or you can start customizing it by clicking Create Form. You’ll see plenty of field options you can add, like Text, Checkboxes, HTML, and others.
Just to give you an idea of what's possible, this is where you’d add the feature that will collect users’ email addresses.
Publish your custom calculator
After you’ve customized your calculator, you can publish it on your site using the Formidable Forms block or shortcode in a sidebar widget. (In case you're wondering, you can use Formidable with the Gutenberg block editor and other page builders.)
The easiest way to add the calculator is to use a WordPress block. You would simply choose Add New Block on whatever page or post you want the calculator to appear on, choose the Formidable Forms feature, then choose your calculator from the drop-down box.
And that’s all you need to do. Using one of our templates, you can have a custom calculator on your WordPress site in no time.
How to add a custom calculator in WordPress from scratch
Let’s say you don't have a business plan with us, or maybe you’d rather start from scratch. That’s not a problem at all. You can still create a calculator in WordPress using Number fields and a math formula.
For this walk-through, the same steps generally apply to any type of calculator you need, whether it's a simple mortgage calculation form, an ROI calculator, or a percentage calculator.
You should already have the Formidable Forms plugin installed (see above for instructions), so just go to Formidable → Add New and create a blank form. You'll get the field options on the left.
Then follow these steps…
Add Number fields
The first basic step is to add the fields you need.
For example, a simple percentage calculator would need three fields: the number, the percentage you want to find, and the value.
Regardless of the calculator you choose, whenever the user needs to enter a period of time (like the Loan Period for a loan payment calculator), you’ll want to set the number range. It’s also a good idea to fill out the Default Value, Placeholder Text, and Field Description boxes wherever necessary.
This will help guide the user as to how they should enter their info.
Create a Total field
Now that you’ve got the basic numbers to calculate what you need to calculate, it’s time to add a Total field. This is where the final calculation will appear.
Revisiting the example of a percentage calculator, the Total field would represent the value (number * percentage = value).
With this Total Number field selected, go to the Advanced tab and turn on the Calculator option. Then in the Default Value (Calculation) box, enter the formula needed for your specific calculation.
The formula for a simple percentage calculator would look like this:
[NUMBER FIELD #1] * [NUMBER FIELD #2]
You would just replace the field IDs in brackets with the field IDs of your form.
If you’re building a calculator for anything else, you will have to figure out the formulas or do some Googling. This is exactly why we built templates -- math can get confusing and you probably don't have time to deal with it.
Add extra fields (optional)
Now that your calculator is complete, you can add extra fields, like an Email field to collect email addresses.
To add a new field, just look through the All Fields tab and find the one you want. Then add it to your form. It’s that easy!
At this point, you would just publish the calculator the same way you would if you were using one of our templates (see above for instructions).
Wrapping up
As you can see, it can be complicated to create a WordPress calculator from scratch. It’s totally possible, but it may involve figuring out formulas and doing some math.
Read more WordPress calculator blog posts
How to Generate Leads with a Calculator Lead Magnet
How to Create a Number Range Slider in WordPress Forms
7 Best WordPress Request a Quote Plugins [2021]If doing math scares you (it should), then we highly recommend using the calculator templates we’ve created that are unlocked with our premium plans. All you have to do is click and choose the fields you want and you’ll be good to go.
I definitely agree about not adding a bajillion plugins to your site. Conflicts aside, abandoned plugins and security concerns abound. Thanks for adding this to Formidable!
Formidable is our "swiss army knife" of plugins for WP. We install it on almost every site we develop. I'm not sure adding another small calc plugin is a big problem, but since we already have FF installed, it's easy enough to create things like calculators.
Thanks for the kind words! Glad you love Formidable Forms.
Do you have a solar energy calculator plugin?
Hi there, Thanks for your question. We don't currently have one, but our calculations are pretty powerful, so you could either create your own, or if you have an example to show us with the calculations involved, we could probably build a template to add to our library.