How to Change the Total Price Calculations With WPForms

Do you want to use WPForms calculations to let your customers select different product options that affect the pricing on your order forms?

When you manage an online store, you may want the customer to be able to select different options for a specific product so you can increase your sales. In this article, we’ll show you how to add product options that change the calculated price for a product with WPForms.

Adding Product Options to Your Order Form

WPForms comes with a variety of different payment fields that let you customize the way you sell your products so you can optimize your eCommerce. You can allow your users to choose different product options that change the total price of your product.

For instance, say you’re selling printed t-shirts and want the user to be able to select things that affect the pricing like:

  • Quantity
  • Size
  • Style (t-shirt or sweatshirt)

You can do that easily by using payment fields with multiple items or dropdown items.

And, adding product options to your order form lets your customers customize their order exactly the way they want.

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

So let’s take a look at the step-by-step guide on how to add product options that change the total price on your order forms.

How to Change the Total Price Calculations With WPForms

Follow these steps to use WPForms calculations on your order form.

Step 1: Create a WordPress Form

The first thing you need to do is to install and activate the WPForms plugin on your site. To get started, read how to install a WordPress plugin.

WPForms WordPress Plugin

It’s the best form builder plugin that lets you build different types of forms including a simple contact form and a newsletter signup form using its drag and drop interface.

Check out our tutorial on how to create an order form.

Step 2: Add Product Options

Now that your order form is created, let’s add multiple product options and allow users to customize the order to their liking.

For this, we’ll be using the Dropdown Items field under the Payment Fields section.

Dropdown Items Field

To customize a certain field, click on the field in your form builder. You can then change the label, items, and their prices.

For this example, let’s add two dropdown item fields and name them Item #1 and Item #2.

add product options that change total price

Keep in mind that you can add more items if you wish, and WPForms calculations will calculate the total. Be sure to set the right price for all the items you add.

You can also change the placeholder text of the dropdown field. To do that, click on the dropdown field in the right hand panel and edit the Placeholder Text option under the Advanced Options on the left hand panel.

dropdown field advanced options

Repeat the above steps for Item #2. Once done, click on the orange Save button in the top right corner.

save your form

Step 3: Publish Your Order Form

To publish the form you’ve just created, head over to Pages » Add New from the left sidebar of your WordPress admin panel.

add WPForms block to a page

Now click on the Add block (+) icon and search for the WPForms widget.  Once you find it, click on it to add it to your block.

Add WPForms Gutenberg Editor

Next, select your order form from the dropdown box to add the form to your page. Now, you can publish your page after making any necessary changes to it.

order form product options in action

Final Thoughts on WPForms Calculations

That’s it! You now know how to add product options that change the total price on your order forms so you can boost your eCommerce sales.

If you enjoyed this article, you might also want to read how to sell digital products on your site.

What are you waiting for? Get started with the most powerful WordPress forms plugin today.

If you like this article, then please follow us on Facebook and Twitter for more free WordPress tutorials.

Using WordPress and want to get WPForms for free?

Enter the URL to your WordPress website to install.

Comments

  1. I am wondering if there is any way to use WPForms in conjunction with WooCommerce. For example, if I wanted to add my name to a shirt. Could I use WPForms to add text input fields to my WooCommerce site?

    1. Hi Heather – We don’t currently have any integration with WooCommerce. I’ve noted that on our feature request list, though, for consideration down the road. Thanks!

  2. What methods of payment will this form take? Do they need to have a PayPal account to use it or can they checkout with credit card as a guest?

    1. Hi Heather,

      Sure so if you’re using our PayPal addon, users should be able to checkout without logging into a PayPal account. However, you’ll need to make sure that your PayPal account is set to be a business account (not a personal account) for this option to appear for your users.

      This business/personal option can be a bit tricky to find, so I’ll share some extra details. Here’s the PayPal page I used to find the setting for this, and here’s a screenshot of the specific instructions from that page that I was able to use to find the correct setting.

      I hope this helps! If you have any additional questions about PayPal, please get in touch with our team and we’d be happy to assist 🙂

      1. Hey Abdur- Good question!

        You can use the ‘Single item’ payment field instead which has a built-in functionality to do this. You can then change the item type to User Defined to allow users to enter the custom amount.

        I hope this helps! If you have any questions, please feel free to get in touch with our team.

        Thanks, and have a good one 🙂

    1. Hi Brittany – We don’t currently have a way to do this, but I’ve noted it on our feature request list for possible consideration. Thanks for the suggestion! 🙂

  3. It looks like I can only set currency to one specific type. How do I set it up to be able to do US Dollar AND Canadian Dollar?

    1. Hi Stephen,

      You’re correct, and currently only a single currency option can be selected. I can understand that more options would be useful in some situations, though, and I’ve noted this on our feature request list for possible consideration.

      Thanks for the suggestion!

  4. Is there a way to add quantities to the Payment Fields/multiple items? Also, is there a way to select multiple items? Now its limited to one item per field.

    1. Hi Thomas,

      We don’t currently have a way to do either of these options, but they’re on our feature request list for consideration in the future 🙂

  5. Can I get the form to total up a dollar amount without adding a Payment Integration. We need to charge inter-departmentally for items, but it is done via department accounting, not actually credit cards, ets.

    1. Hey Sharon,

      Yes, they payment fields (including Total field) are available and work even if a payment integration is not active. The credit card field is only available when Stripe is installed and activated but everything else is there. Hope that helps 🙂

  6. Is there a way for a customer to manually input the quantity they desire (not select it from a dropdown), and then the total is updated (multiplied) by that amount?

    1. Hi Michael,

      We currently don’t have a way to run calculations for product quantities the way you described. A possible workaround for this would be to create a Dropdown Items field for each product and fill in the dropdown options with various quantities and associated prices. This would allow you to offer both multiple products and various quantities of each of those products.

      I’m sorry we don’t have exactly what you’re looking for but I hope this might help as a good starting point. 🙂

      1. +1 feature request to support background calculations. would make wpforms hugely more flexible!

      2. Hey Henry – Yes, that is going to be a great feature for sure, I have gone ahead & added your vote to the feature request. Thanks for the suggestion!

  7. Is there a coupon option in WPForms? I would like to offer coupons and automatically reduce the total amount based on the coupon used (e.g. 20% off total)

    1. Hi Beth,

      We currently don’t have a coupon field available but you can workaround this by adding in two Multiple Items fields — one with normal pricing and one with discounted pricing. You can also added a Single Line Text field to accept a coupon code. The last step was to create conditionals for each of the item fields. To do this, click on one of those fields and open the Field Options screen. From there, open the Conditionals section and check ‘Enable Conditional Logic’.

      For the full price items, the logic should resemble this screenshot. This tells this field to be hidden if the correct coupon code is entered.

      The discounted item’s conditional logic should be set to display when that same ‘coupon code’ is entered.

      I realize this is not an ideal solution, but hopefully it helps! If you need any extra assistance, please contact us over in support! 🙂

      1. Would like to know more about this. Is there any update to discount codes in WP Forms? The screenshots are not available anymore.

    1. Hi Conrad,

      We don’t have a way to do this right now, but I’ve made a note on our feature request list so we can keep it on our radar! Thanks for the suggestion 🙂

      1. Just wondering if anyway to multiply one field by another field yet? Say I input a number field and have it multiply by a set value to get a total. I have a badge for sale but my customer wants 245 of them, its kind of hard creating a dropdown field for that.

      2. Hi Matthew, thanks for your question!
        Currently, our forms don’t have the ability to perform calculations in the way that’s shown in the example you provided.
        I apologize for any confusion.
        Have a good one 🙂

  8. The order quantity feature isn’t working for me. How do I create the option to order a quantity of more than 1 item at a time and have the purchase price properly calculated for multiple items?

    1. Hi Courtney,

      We don’t have a way to run calculations required for product quantities, but I’ve made a note on our feature request list so we can keep it on our radar! Thanks for the suggestion 🙂

    1. Hi Anthony,

      We don’t have a built in option for Japanese Yen at this moment but you can add it in by using some custom code:

      /**
      * Add Japanese Yen
      *
      * @param array $currencies
      * @return array
      */
      function wp_add_currencies( $currencies ) {

      $currencies['JPY'] = array(
      'name' => __( 'Japanese Yen', 'wpforms' ),
      'symbol' => 'JPY',
      'symbol_pos' => 'left',
      'thousands_separator' => ',',
      'decimal_separator' => '.',
      'decimals' => 2
      );
      return $currencies;
      }
      add_filter( 'wpforms_currencies', 'wp_add_currencies' );

      In case it helps, here’s our tutorial with the most common ways to add custom code like this.

      Thanks! 🙂

    1. Hi Roman,

      While there isn’t a way of adding a word right next to the actual number in the Total field, you can edit the the total field’s label to read whatever you’d like.

      I hope this helps! 🙂

  9. Hello, is there a way to input a default starting amount to the total so other choices will add to it without user being able to change this field.

    Clearly, instead of starting with a total of “0”, is it possible to fix to “100” and others choices will add their value to this “100” ? And users cannot change this starting amount?

    1. Hi Serge,

      You can add a Single Item field and assign a default value to it. That way, this amount appears in the total field by default and anything else that the user selects that as a dollar value attached to it will be added to that total value.

      I hope this helps!

  10. hiya! was wonder if there were a way to input quantity versus in a dropdown with set values.. and if not yet, when you might add the ability to..?

    1. Hi Dustin,

      I’m sorry but I don’t understand your question. Can you provide more info on what you’re trying to do?

      Thanks!

  11. My form has the option to purchase multiple items. When I choose two or more, the form totals correctly. However, it won’t generate the Paypal page after submitting the form. Not sure why. Any ideas?

  12. hi great plugin!
    i am building a restaurant menu.
    i have some questions:

    1) Any news on quantity multiply price field?
    fe.: „XX Quantity„ mulitply price.
    would be really great.

    2) i have more than 30 products:
    is it possible to hide not chosen products from email notification?
    so if the user does not choose meal nr 1-8 but he chooses meal nr.9 so 1-8 is not showing up as not chosen?

    3) is there a way to make subcategories as a kind of navigation or menu in any way? for example:
    soups, burgers, desserts…

    the multi step form solution could work for that if i can set an anker zu every site or so…

    can i set up a „back“ button to multi side step? there is a „next“ button, but i cant go backwards.

    thx

    1. Hi Alexander – I’ve shared some details to your questions below:

      1) As of right now, we don’t have plans to add a quantities option in the very near future. But I definitely understand how helpful this would be for order forms, and it’s still on our radar!

      2) Any items that are not selected shouldn’t show up in your notification email. If you’re using a dropdown, though, you’ll need to be sure you’re using placeholder text (explained in this tutorial). Placeholder text only displays in an “empty” field (where the user hasn’t selected anything) — and so that field won’t show up in your notification emails unless the user actually selects an option.

      3) I’m sorry, but I’m not sure I understand your goal in this one. When you have a chance, could you please reach out to our support team with more details?

      Last, you can definitely display a “Back” button in a multi page form! Just open up the form builder, then (in the right-side preview area) click on a Page Break field. This will open its Field Options panel where you can enable the “Display Previous” option. You can find more details in our multi page form tutorial.

      I hope this helps! And we’d be happy to help with #3 and any other questions over in at that support link. Thanks 🙂

  13. Hi there

    I made an order online form, I add a dropdown select quantity field. my problem is when I go to the form I see a big gap between the product fields seem is the size of the dropdown fields, how I get rid of that? could you help me, please? Thanks in advance

  14. I’m creating an order form, and I was wondering if there is there a way to put a negative dollar amount (a credit) as a value? Certain things are included with my standard option, but there are delete options that need to make the total price come down. Thanks.

    1. Hi Nicholas.
      Currently, we do not have a built-in option to use any other characters than digits in the payment Item fields (as the “-” minus character required in this case). I do agree it would be super helpful, though. I’ve made a note of the feature request and we’ll keep it on our radar as we plan out our roadmap for the future.
      Currently, you can try to use the Conditional Logic feature to display Item fields with the lower values conditionally, when a user chooses certain options in other fields.
      I hope this helps.
      Have a good one 🙂

  15. For the “Total” feature under the payment field, is it possible to condition the total value to exclude another feature (eg. “drop down”) from the payment field?

    1. Hi Jaslyn.
      You can use the conditional logic for the payment fields in order to ad them to the Total field or not. So if a dropdown items field is conditionally hidden, then its value won’t be added to the Total field.
      And in case it helps, you can check more regarding Conditional Logic in this article on our site.
      I hope this helps.
      Have a good one 🙂

      1. Hi Anatolii,
        Thank you for your feedback, however I missed out on the part where I’m including 2 “Total” features in my form. First one includes everything while the second one only includes some payment field features. Thus, hiding the dropdown field does not help! Is there any other way for me to make this happen?

      2. Hi Jaslyn.
        It seems like you don’t have to use two Total fields for this. But instead, display other payment fields conditionally and the correct total amount (from all the displayed items fields) will be displayed in the Total field.
        A/nd in case you still have issues with this, please submit a support ticket on our site and some of my colleagues will be glad to help you out with this.
        Have a good one 🙂

  16. How can I add an individual price to each item on a checkbox so the price shows beside each item on the checkbox as well as in the total? Also, how do I add something to the total based on a multiple choice selection?

  17. Is there a feature to multiple order price or add percentages to costs… When will we get multiplication features in WP Forms???

    1. Hey Bakare – This is in our feature request list for sure, I am afraid we don’t have an ETA though on the release of this feature. I will go ahead and add your vote there.

      I am sorry for the inconvenience!

    1. Hey Oggy – I am afraid we don’t have a direct option to do the calculation. We have this on our radar for the future. I would suggest contacting our support team here and provide them more context, based not the exact situation we might be able to suggest some workaround.

      Thanks 🙂

    1. Hey Catherine- This is in our feature request list for sure! Currently, we don’t have an ETA though on the release of this feature. I will go ahead and add your vote there.

      I am sorry for the inconvenience!

    1. Hey Uzair – I am afraid we don’t have a built-in option like this. This would be a great feature to have, so I have gone ahead and added a feature request on your behalf. We’ll keep it on our radar as we plan out our roadmap for the future.

      Thanks for the suggestion.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.