Help Center

How to Set Automatic Price Calculator

How to Set Automatic Price Calculator

This tutorial provides all details on how to set prices for every apartment you offer and define the price rates depending on the number of days a user wants to book. Besides, this guide will teach you to display the total price automatically in the booking form and WooCommerce order.

Before you start, check the tutorial requirements:

  • WooCommerce plugin installed and activated

  • JetBooking plugin installed and activated

  • JetFormBuilder plugin installed and activated

  • JetEngine plugin installed and activated

Use Case with JetFormBuilder

Adjust booking price and pricing rates

In the WordPress Dashboard > Bookings > Settings directory, open the General tab. Here, you can see the post type applied as a Booking instance post type.

In this post type, the fields for editing the booking settings are added, so we will edit the posts of this post type accordingly.

booking instance post type field in the general settings

As the “Products” post type is selected for bookings, we fill in the booking fields in the Woocommerce products. 

On the product editing page, there is a Pricing Settings block, in which the Price per 1 day/night is added. This price can be displayed on the Single Product Page or in the Listing Grid of products.

Warning

Mind that the Price per 1 day/night is for numbers only. Any other characters are not accepted there.

pricing settings section

Besides adding the static price for one day or night, you can also create flexible price rates. 

It means you can set a different price for a longer-term stay. For example, if a visitor rents the accommodation for three and more days, the price per day will be not $30 but $21. 

Click the “Add rates” button to call the rates settings.

add rates button

Press “Add new rate”  to specify the new rates. 

In our example, we added a new rate for bookings that last from three days with the price of $21. 

Add as many rates as you want. When you are done, hit the “Save” button.

add new rate button

There is also an opportunity to add special prices on specific days of the week by hitting the “Add weekend” button.

weekend pricing settings

You can also add special prices for specific date periods using the Seasonal prices settings.

seasonal prices section

Show pricing rate on the single page

Check how this pricing can be displayed on the Single Product Page.

You can add a widget that will display the dynamic price. It can be a Heading or Text Editor widget.

Click on the Dynamic Tag icon, and select the “JetBooking: Price per day/night” option.

jetbooking price per day or night dynamic tag

In the “JetBooking: Price per day/night” option, we picked the “Prices range” to be displayed (Show price field).

Also, we enabled the Change Dynamically toggle to change the price according to the dates selected in the booking form on the Single Product Page

You can also edit the Currency sign and its position according to your needs.

prices range option selected

Check how the price is displayed on the front end.

Now the price range shows $19-35 according to the Pricing Settings of the product.

price range on the front end

Add a total price field to the booking form

Check how the pricing can be displayed in the booking form.

Go to WordPress Dashboard > JetFormBuilder > Forms, and open the Single Page Booking Form for editing.

edit button next to the jetformbuilder form

In the form, you need to add a Calculated Field.

calculated field in the form

Check the block settings. 

There are also macros available for JetBooking. The macro we need is %ADVANCED_PRICE::_check_in_out%, where the “_check_in_out” needs to be substituted with the name of the Check-in/check-out dates field used in the form. 

Another available macro is %META::_apartment_price% which returns the Price per 1 day/night meta field. Be aware that it does not change the price according to the number of chosen days; it will always show the static value from the meta field bar.

macros in the block settings

Check the inserted result into the Calculated Field in the picture below.

calculated field with a macro

Add the total price to the WooCommerce order

In the same booking form built with the JetFormBuilder plugin, we can use the Calculated Field to fill in the price used on the WooCommerce checkout and order. To do so, open the Post Submit Actions tab, and add the “Apartment Booking” action.

Besides mapping the Apartment ID Field and Check-in/Check-out Date Field, we should select the Calculated Field, which contains the advanced price formula as a WoCoommerce Price Field

Hit “Update” and save the form.

If you leave the Wocoommerce Price Field empty, WooCommerce will use the value of the Price per 1 day/night meta field of the “Room” Custom Post Type.

woocommerce price field completed

Use Case with JetEngine

Add a total price field

Now let’s make the form show users the entire cost of their booking. Go to WordPress Dashboard >JetEngine > Forms and open the booking form you created.

Click “Add Field” and proceed to edit it. Choose the “Calculated” Type, and complete the Name and Label. In the Calculation Formula text area, type the %ADVANCED_PRICE::_dates % (“_dates” here is the ID of your Check-in/Check-out Dates field). You can just copy that formula from the list to the right from the text area.

total price calculated field

Let’s take a brief look at the Booking macros tips, shown to the right from the Calculated Formula text area:

  • %ADVANCED_PRICE::_check_in_out% macros is the one that counts the total price. It multiplies the number of selected days with the Price per 1 day/night meta field value. Additionally, if you set some pricing ranges, it will calculate the total price according to them;
  • %META::_apartment_price% macros return the value you place to the Price per 1 day/night meta field. Be aware that it doesn’t change the price according to the number of chosen days, it will always show the static value from the meta field bar.

Next, type in the currency sign to the Calculated Value Prefix or Calculated Value Suffix and hit the “Apply Changes” and “Update” buttons.

Let’s see how it works on the front end. For example, the default price for the room is $12. However, if a user wants to book the room for five days and more, the price will reduce to $10 (so the total will be $50).

Additional options

Things to know

If the Price per 1 day/night meta field (the one in the Price Settings meta box and attached to every Room CPT) is empty, the Calculated Field will fail to count the total price and show a zero result.

If you have a separate meta field for pricing and want to use it in the total price formula, you need to perform a few additional steps.

Go to the Post Type or Meta Box where you created the Price meta field, open it, and copy the ID of the field (the text you put into the Name bar). Proceed to the booking form, hit the “Add Field” button, and start editing it. You don’t want the user to see it in the form, so choose the “Hidden” Type.

total price calculated field

Type in the Name and Label, then choose the “Current Post Meta” option in the Field Value drop-down menu. Paste the copied ID to the Meta field to get value from bar and click the “Apply Changes” button.

After that go to the Calculated field and change the Calculation Formula to:

%FIELD::_dates%*%FIELD::price%

%FIELD::_dates% macros will return the number of days the user select.

%FIELD::price% macros will use the value of the Hidden field you just created.

So, according to the formula, the number of days/nights selected by the user will be multiplied by the price you set in the corresponding meta field. If you need more information on the topic, go through our Hidden and Calculated Fields guide.

Add the total price to WooCommerce order

Go to WordPress Dashboard > JetEngine > Forms and open the booking form you created. By this time, WooCommerce will have to be enabled for JetBooking. If you don’t know how to do it, check out the WooCommerce enabling tutorial.

Scroll to the Post-submit Actions / Notification Settings and open the Apartment Booking. There is a WooCommerce Price field option there. Clicking on it, you will see the drop-down menu with all the created form fields. Choose the field you would like to use for the total price shown in the checkout form and order.

woocommerce price field

If you leave that field empty, WooCommerce will use the value of the Price per 1 day/night meta field of the Room custom post type.

Now you can set the prices and simplify your work sufficiently with an automatic calculation of the total price.

Was this article helpful?
YesNo

Need help?

Ask Facebook community

Get answers from 22K Crocoblock Community experts from all over the world.

Start a live chat

Ask question to support agent and share its details via chat messages.