Want to create a WordPress price calculator for a website? This step-by-step guide will show how to create an amazing price calculator in a few simple steps
Approximate read time: 6 minutes
Online shopping has become part of our daily lives and is here to stay. In 2023, an astounding 2.64 billion people made a purchase online, according to Insider Intelligence.
That's a big pool of potential customers — and a big goldmine to tap, too!
But while it's easier than ever to get your online store up and running, eCommerce has become increasingly competitive.
And do you know one of the easiest and most effective ways to increase your chances of success? 🤔 Adding price calculations to your website.
Create a Price Calculator Now!
We promise it's easier than you might think! All you need is a good calculator WordPress plugin, and your site will be quickly crunching numbers.
So, let's show you how to use Formidable Forms to create a price calculator for your website.
Why create a price calculator for your site?
Cost calculators are the unsung heroes of eCommerce.
For online stores, these handy tools allow customers to choose product options like quantity, color, and size and then see the final price in real-time.
Instead of using them as product price calculators, service businesses can factor in hourly rates, labor costs, material costs, profit margins, and more to create cost estimates.
Plus, instant online quotes mean no more manual math for you and no more waiting around for customers.
All that adds up to happy site visitors, time saved, and increased sales! 😃 + 💨 = 💰
How do you create a price calculator in WordPress?
To make a price calculator for your website, you must install and activate Formidable Forms on WordPress. If you don't already have Formidable, pick up this powerful form maker below.
The plugin is simple, but you may find this step-by-step guide helpful.
Alright, ready to do some calculating? Let's get cookin'!
Aren't on WordPress? Here's how it compares to other platforms like Wix websites.
Step 1: Create your online order form/product price calculator
From the WordPress dashboard, head to Formidable → Forms and click Add New.
Next, select from the 225+ pre-built form templates or Create a Blank Form.
To save some time (and satisfy our sweet tooth!), let's use the bakery order form template today. 🧁
🧑🍳 If you prefer making things from scratch, check out this tutorial on how to create an order form.
Name your order form, and let's get baking building!
Step 2: Set up pricing based on product and product options
You'll see the available form fields on the left when the form editor opens. Scroll down to the Pricing Fields to find all the ingredients you need to calculate prices.
Add a Product field to your form and specify item prices in the calculator.
In the field options, you can choose whether to display the product options as a Dropdown, Radio Buttons, or Checkboxes.
Now, fill in the names of your products (or descriptions of each product variation) and the prices.
Step 3: Add the final form fields
Once you've entered your items and options, drop a Quantity field into your form.
Then, it's time to add a Total. Don't worry. You won't have to fight with formulas — this field automatically does the math for you!
And finally, let's insert a 💳 Payment field at the bottom so customers can actually buy our baked goods!
When you're happy with your form, click Update in the top right to save!
ℹ️ The total won't update inside the form builder. To test your custom calculator widget, all you have to do is click the Preview button!
Wondering how to add tax to your price calculator?
You can easily add sales tax to the total in your price calculator. Add a #Number field to your form and enter your tax calculation in the advanced field options.
Insert a second Total field, and now you'll have the total cost, including tax!
Find more detailed steps in this Knowledge Base article.
Step 4: Accept payments
Here's where you start rollin' in the dough — see what we did there? 🤭
Before starting this step, you'll need a payment gateway on your site. We use Stripe in our example since it supports 15+ payment methods, including debit/credit cards, bank transfers, and digital wallets. Here's how to connect Stripe to WordPress if you haven't already.
Okay, back to the form builder! Click the Settings tab at the top of the screen. Under Actions & Notifications, choose Collect a Payment.
Next, you can adjust the payment description, amount, currency, and frequency. Then, hit Update to save your sweet new WordPress price calculator!
Want to use other payment methods? Formidable can accept PayPal payments and create Authorize.net payment forms too.
All that's left is to give our users a taste! 🧁
Step 5: Publish the price calculator on your website
The final step is to share your creation with the world! You could publish it on:
- Individual product pages to encourage users to add it to their cart,
- In users' shopping carts to show delivery fees with a shipping calculator,
- Your home page to offer instant quotes and act as a lead magnet,
or anywhere else you please. Embed your form on a page or post by clicking the Add Block icon in the top left of the WordPress editor.
Then select the Formidable Forms block. Finally, choose your form from the dropdown list to add it to the page.
Publish your page, and your interactive calculator is now online. Easy as pie! 🥧
Ready to make your custom price calculator?
Piece of cake, right? 🍰 So now you know our secret ingredient, you're all set to start calculating costs on your site!
Before we go grab some sweets, let's sum up how to make a calculator for your website:
- Install Formidable Forms on your WordPress site
- Create a form from a template or from scratch
- Add eCommerce fields: Product, Quantity, Total, and Payment
- Adjust form settings to Collect a Payment
- Save and publish it on your website
We hope this guide helped you create an incredible tool to fuel sales and lead generation.
And if you're eager to add even more engaging interactive content to your site, remember that Formidable Forms can do way more than price calculations. You can whip up an ROI calculator, a fitness tracker, reservation forms, surveys, quizzes, and more too!
Craving more calculations? 😋 Follow us on social media, over on Facebook, Twitter, and YouTube.
10 Best WordPress Calculator Plugins
7 Best Tax Calculator Plugins for WordPress
5 Best WordPress Shipping Calculator Plugins
How To Make a Fitness Calculator in WordPress (In 2 Steps)
How To Create a Number Range Slider in WordPress
The Ultimate WordPress Calorie Calculator Plugin
How To Create a Mortgage Calculator in WordPress [No Code!]
The Best Time Addition Calculator for WordPress
How To Calculate the Day From a Date [Past & Future Dates]
How To Calculate Days Between Dates [Make a Date Calculator]
Create an Online Date Calculator the Code-Free Way
7 Best WordPress BMI Calculator Plugins for Fitness Experts!
9 Best Investment Calculator Plugins for WordPress
8 Best Mortgage Calculator WordPress Plugins for Real Estate
7 Best Cost Calculator WordPress Plugins
Is there a way to make this work with repeater section? Seams as soon as I choose to have multiple products from a repeater section the calculation is wrong.
Separate values work great but need to have a quantity associated with the selection. As Marc says, repeater fields automatically add values to a total field and a field is added.
Please I run a courier company and need a price calculator. I am base in Lagos and need to calculate the price such that delivery within Lagos but different weight will attract different price. Example: 1kg package delivery within Lagos will cost 6500naira, while 2kg package delivery within Lagos will cost 800naira, etc
Delivery to other state but different weight will attract different price. Example delivering a package from Lagos to another state other than Lagos e.g Port harcourt while weight is 2kg cost 2500naira, delivering a package from Lagos to another state other than Lagos Port harcourt while weight is 5kg cost 4900naira etc
Delivery from other states to Lagos with different weight will also attract different price.
good explanation for how to setup calculate price
Hi, does the calculator offer an option to calculate in different currencies? and does it allow to manipulate variables, ie: a product costs X (with a minimum of 20 attendees) for every extra person added at a fixed value it will add Y, and should allow adding of optional extras the user can select which will add Z and gives us the total of A with the option to download the quote as a PDF