Are you looking for an opportunity to range your products by price?
The Range filter type allows setting the certain range within which one has to query numeric values. One of the most frequent usage is prices filter for WooCommerce store pages.
With Price Range filter, your visitors can select the range within which to look for the products or posts. You’ll be able to set the minimum and maximum values for product price to let the visitors choose only the products with the suitable price.
From this tutorial, you’ll learn how to create a Price Range Filter with JetSmartFilters plugin. So, let’s have a closer look at it.
Creating a Price Range Filter
To find out how to create a Range filter, follow this link.
Note, that to create a Price range filter, you should add the “_price” meta field in the Query Variable field.
Adjusting a Price Range filter for WooCommerce products
You might have another way of displaying WooCommerce products, e.g. WooCommerce Archive.
Step 2 — Then, open the needed JetWooTemplate to which you want to add the Range Filter (for example, the Product Grid). Then, drag-n-drop the Range Filter widget to the selected section.
Step 3 —In the Content settings block, choose Range filter and use it to filter products in Product Grid. You can select any other option in the list that is integrated with WooCommerce products.
You can also choose the filter type between AJAX and Page reload, apply this filter on Value change or Click on apply button settings.
Step 4 — Afterward, you can change the appearance of your filter in the Style settings section.
Step 5 — When you’re done with settings click on the Publish button and see the results.
Now you can easily create a Price Range filter for your products. Hope this tutorial was useful.