How To Easily Add a Handy Cost Calculator to a WordPress Website

Including a value calculator to your enterprise web site will be an effective way to enhance your backside line. By permitting potential prospects to rapidly and simply decide how a lot your services or products will value, you can also make their decision-making course of simpler. Consequently, they’re extra seemingly to decide on you over your opponents.

There are a number of methods of including fundamental value estimation performance to an internet site, akin to utilizing widgets or CSS. Nevertheless, Stylemix Themes’ Price Calculator Plugin for WordPress gives a extra elegant, versatile means.

What’s a Price Calculator?

Price calculators accumulate sure variables from web site guests to calculate the full worth of a services or products.

For instance, in case your web site sells home windows, the enter fields might embrace the scale of the window opening, kind of body materials, double or single glazing, and so forth., all of which influence worth. As soon as the customer has enter all of the required knowledge, the calculator mechanically generates the price of the window, thereby saving you from having to do it manually.

Typical Price Calculator Purposes

There are such a lot of companies that may make use of a value calculator, and listed below are just some typical examples:

  • Lumber mills
  • Salons, magnificence parlors, and spas
  • Automobile and gear rental businesses
  • Graphic and internet designer businesses
  • Medical providers suppliers
  • Webhosting firms
  • Skilled providers akin to copywriting, bookkeeping, and so forth.
  • Cleansing and housekeeping providers
  • Print providers
  • Plasterers, painters, bricklayers, and so forth.
  • Flooring firms
  • And lots of extra…

The checklist is nearly limitless, and nny enterprise that manually prepares quotations and estimates can usually profit considerably from including a value calculator to its web site.

Moreover, these calculators aren’t essentially restricted to value calculations. For instance, a well being membership web site or health weblog might have a BMI calculator, whereas a recipe web site can use them for metric to imperial conversions.

Stylemix Themes’ Price Calculator Plugin for WordPress

The Cost Calculator Plugin for WordPress by Stylemix Themes contains all of the options wanted so as to add enticing, full-featured value calculators to your web site rapidly and simply.

A free version of the plugin is out there. That boasts wonderful starter options, together with a strong calculator builder, limitless types, numerous customization choices, prompt value estimations, foreign money choices, a user-friendly interface, and so forth.

Nevertheless, I like to recommend the Professional model because it brings tons extra helpful options to the desk, together with:

Article Continues Beneath

  • Conditional system
  • Date picker, multi-range slider, picture dropdown, and file add customized parts
  • WooCommerce integration
  • Capacity so as to add a number of calculators on a web page
  • Wide selection of customization options
  • Pre-built calculator type with directions for quite a lot of industries
  • Stripe and PayPal integration
  • Contact Kind 7 and Ship Kind integration
  • reCAPTCHA safety
  • Calculator duplicate and import/export services
  • Orders dashboard, together with hassle-free order monitoring
  • Premium assist

The desk under particulars the present pricing for the Professional model:

Max. Variety of Web sites Annual Lifetime
1 $29.99 $99.99
5 $79.99 $239.99
25 $199.99 $599.99

Get Cost Calculator Plugin for WordPress Pro

Putting in the Price Calculator Plugin for WordPress

The free model of the Price Calculator Plugin is out there within the WordPress plugin directory, or you will get it by way of the plugin website. I’m not going to undergo the complete course of of putting in and activating it, as it’s the similar as for every other plugin. Nevertheless, should you’re uncertain how you can do it, the documentation covers the method.

For the Professional model, you have to to buy a license and obtain the plugin by means of the plugin web site. Earlier than putting in it, it is very important notice that you will want to put in the free model first. For those who try to put in the Professional model alone, you may be prompted to put in the free one first.

After activating the Professional model, you have to to enter the license key you obtained if you purchased it:

Screenshot showing where the Cost Calculator Plugin for WordPress license key is entered

As soon as the plugin is put in and activated, a brand new menu merchandise will seem in your WordPress panel – that is the place you create your calculators:

Location of the Cost Calculator Plugin menu in the WordPress admin panel

Including a Price Calculator to a Web site

I’ll now undergo the method of including a fundamental value calculator to an internet site utilizing the Price Calculator Plugin. I say fundamental because the plugin is able to rather more than this text’s scope can cowl. Subsequently, I strongly counsel studying the plugin website and documentation to see what else it will possibly do. Furthermore, the developer has additionally created a library of helpful videos that features some tutorials.

Step 1

Within the new Price Calculator menu merchandise that seems within the WordPress backend, click on value calculator, after which click on the inexperienced ‘Create New’ button:

The Cost Calculator panel in the WordPress admin area

Step 2

Underneath the ‘Calculator’ tab, enter a reputation for the brand new calculator after which hit the inexperienced button with the ‘+’ image:

Creating a new cost calculator

It’s okay to make use of any identify, however I counsel making it related, so it’s straightforward to recollect.

Step 3

Subsequent, a panel will seem containing a piece space the place the fee calculator shall be constructed utilizing drag-and-drop parts:

The calculator panel where the calculators are created

As you may see, on the right-hand facet, there are numerous parts to play with, though those used in the end depend upon what the calculator is required to do.

In my case, I need it to calculate the price of copywriting providers and can use a slider for the variety of phrases. Merely drag and drop the Range Button (which is a spread slider) from the checklist of parts on the proper to the place it says ‘Place Ingredient Right here’:

Image showing the Range Button being dragged and dropped into the calculator area

Step 4

After dropping a component into place, a popup instantly seems containing numerous configuration choices which is able to fluctuate relying on the aspect chosen. For instance, within the case of the Vary Button, it’s needed to supply issues like an outline of how you can use the slider, the utmost and minimal vary values, vary step, and so forth. – different aspect varieties will present completely different configuration choices.

Beneath is the vary button configuration for my copywriting value calculator. I wished the slider to start out at 500 phrases minimal and go as much as 25,000 most in increments of 500. You’ll notice that I’ve put ‘phrases’ within the foreign money discipline because the vary is to be phrases slightly than $:

The Range Button configuration panel
The Range Button configuration panel (continued)

After getting into the configurations for the chosen aspect, hit the inexperienced ‘Save’ button. To check the button and see how the fee calculator will look, merely hit ‘Preview’:

A preview of the calculator in action

Don’t fear if the calculation within the Complete Abstract part is wrong – that shall be fastened later.

Step 5

In fact, it’s doable so as to add many extra parts to the calculator if wanted. For instance, I’ll add a checkbox that permits my buyer to decide on if they need a 24-hour turnaround for a $200 surcharge.

After dragging and dropping the Checkbox aspect into the calculator, I added the next configurations:

The Checkbox configuration panel

Right here is the completed checkbox in motion:

Preview of the Checkbox in action in the calculator

Step 6

Now the required parts have all been added, it’s essential to get them to calculate appropriately within the Complete Abstract.

To do that, we use the Total aspect. Once more, simply drag and drop it into place, after which the configuration panel will popup:

The Field element configuration panel

The calculation I would like is:

(output from the vary slider x my charge of $0.08 per phrase) + output from the 24-hour service checkbox

You will note beneath accessible fields two inexperienced buttons: ‘range_field_id_0’ and ‘checkbox_field_id_2.’ These include the outputs from the Vary Button and Checkbox, respectively. If different parts have been added, these would additionally seem as inexperienced buttons right here.

To construct the system, that is the sequence of actions I must observe:

  1. Click on ( in ‘Obtainable Operators’ to open the parenthesis within the Calculator Components discipline
  2. Click on the inexperienced ‘range_field_id_0’ button so as to add it to the ‘Calculator Components’ discipline
  3. Click on * in ‘Obtainable Operators’ so as to add the multiplication operator
  4. Sort 0.08 (i.e., my charge per phrase) subsequent to the *
  5. Click on ) in ‘Obtainable Operators’ to shut the parenthesis
  6. Click on + in ‘Obtainable Operators’ so as to add the addition operator
  7. Click on the inexperienced ‘checkbox_field_id_2’ button so as to add it to the ‘Calculator Components’ discipline

That is what the completed calculation seems to be like:

The field element configuration panel showing the completed formula

Now all click on ‘Save’ and preview the calculator to examine the whole lot is working okay:

Preview of the completed cost calculator

The Complete aspect is extraordinarily highly effective, as you need to use the Obtainable Operators to construct advanced calculations utilizing the outputs generated by any of the opposite parts used.

Step 7

My fundamental calculator is now full and able to be inserted into my web site, which is tremendous straightforward to do.

Merely click on on ‘Price Calculator’ within the WordPress admin panel menu. That may take you to the ‘My Calculators’ web page, the place you’ll find a listing of all of the created calculators (as I solely constructed one, that’s all my checklist accommodates.) Subsequent, click on on the shortcode in opposition to the calculator you want to use – that may copy the shortcode to the clipboard:

Location of the shortcode used to embed the calculator into content

Go to the WordPress put up or web page the place you want to place the calculator, and easily insert the shortcode wherever you want it utilizing the ‘Shortcode’ block (or aspect if utilizing Elementor):

Shortcode being embedded into a daft post

Publishing the web page or put up then units the calculator reside:

Preview of the calculator embedded into a post

That’s Not All, Of us!

In fact, loads of different issues will be achieved to the calculator utilizing the features and choices contained within the Situations, Settings, and Customise tabs. Detailed data on these is out there within the plugin documentation and video library. Nevertheless, right here’s a abstract of the aim of every tab:


Whereas the Complete aspect mentioned earlier permits for creating advanced mathematical equations, the Situations tab – which is a Professional function solely – expands these additional utilizing logical situations. For instance, AND, OR, is/isn’t chosen, is bigger/lower than, is/isn’t equal to, and so forth., are all accessible.

The accessible situations depend upon the weather in use, and creating relationships is straightforward because of drag-and-drop.

The Conditions panel


The Settings tab accommodates basic world configurations, such because the foreign money image for use, the wording required for the full abstract, whether or not to show zero values or not, and so forth. It additionally contains the configurations for types, WooCommerce, cost integrations, and so forth.

The Settings panel

You may additionally discover that the Price Calculator menu within the WordPress admin panel accommodates an ‘Orders’ possibility. This permits monitoring of orders from calculators which have been monetized utilizing one of many cost integrations:

The Orders panel


The Customise tab contains tons of choices to jazz up calculators or make them match a web site’s branding. One significantly good function of this tab is which you could see the adjustments made to the calculator in real-time earlier than saving them.

The Customize panel showing the calculator after adding some customizations

The Verdict

I’ve to say, I’m in love with Stylemix Themes’ Price Calculator Plugin for WordPress and will certainly be utilizing it on my enterprise web sites.

Creating each easy and complicated calculators is an absolute breeze because of an intuitive interface, drag-and-drop, and detailed documentation. Moreover, the calculators add an interactive aspect to your web site, which helps with engagement. Better of all, the PayPal and Stripe integrations permit your prospects to pick out the choices they need and pay by way of the calculator so that you could seize their enterprise (and {Dollars}) instantly.

No matter kind of enterprise you run, it’s doable that your web site may benefit from the addition of a calculator. Not solely will it create a greater person expertise for web site guests, it can additionally give them the customized value data they want mechanically, permitting them to make a direct buying resolution. And the Price Calculator Plugin for WordPress will make including calculators to your web site tremendous straightforward.

Try Cost Calculator Plugin

Leave a Reply

Your email address will not be published. Required fields are marked *