How to Add a Price Filter to WooCommerce (Step-by-Step)

Want to make it easier for customers to find products within their budgets? You should consider adding a price filter to your WooCommerce store.

A price filter allows customers to define their own price range, helping them perform quick, targeted searches. In this post, we explore how you can add a WooCommerce price filter using a recommended product filter plugin.

Why use a price filter on your WooCommerce store?

A price filter is one of many types of product-based filters. It enables customers to select a minimum and maximum price and shows products priced within that range. WooCommerce price filters can take the form of a price slider with a meter that shoppers slide to select their preferred price range, a dropdown list of different ranges, or checkboxes indicating different price ranges.

A price filter can streamline searching for products on your WooCommerce store, which comes with a whole host of benefits. Here are just some of the advantages of adding a WooCommerce price filter to your store:

• Improved customer experience: Ease of shopping on your site will satisfy customers and encourage them to return.
• Increased conversions: If customers can find what they are looking for easily, they are more likely to buy it.
• Improved product visibility: Give all products a fair chance of being seen and draw attention to less popular items.
• Higher revenue: A positive customer (and product) experience bodes well for repeat sales and revenue growth.
• Better SEO: An increase in dwell time from exploring products across price ranges can help improve SEO.

Still not convinced? Let’s take a look at some specific use cases of product price filters and how these can benefit your WooCommerce store.

To appeal to price-conscious customers

Customers focus on price when making buying decisions online and in person. In fact, 60% of consumers consider pricing to be the very first consideration in their buying decision. Some are more sensitive to prices, and can be expected to spend considerable time finding good deals.

For example, imagine you run an eCommerce store that sells T-shirts. A customer might visit your store with a strict budget of $30. If you don’t offer the option to filter by price, they would need to scroll through your entire product catalog in order to find the products that fit their budget. If you offer a price filtering option, however, the process is made much easier.

In this way, a price filter is a way to remove friction from purchasing – price-conscious customers can filter by a price range that suits their budget, avoiding the need for them to scroll through your entire price catalog in order to find suitable products.

To improve the search experience on your multi-currency eCommerce store

Offering multiple currencies on your eCommerce store is a great way to expand your business and reach new markets. Pricing products in buyers’ local currencies will allow you to target sales of particular products toward particular markets, and offer a seamless experience for your customers. 

If you sell products in different currencies, a price filter will be a useful addition to your store. As we’ve already noted, price filters enable you to filter products by a price range, rather than a specific individual price. This is especially useful for multi-currency eCommerce stores as if customers choose to shop in a currency other than your store’s default base currency, your product prices won’t be set values; rather, they will vary based on currency exchange rates.

This means that if a customer shopping in a different currency could only filter your product catalog by a specific price, they wouldn’t be guaranteed to find the products they were looking for. Let’s return to the example of the T-shirt store to demonstrate.

Let’s say your eCommerce store offers a particular range of T-shirts that retails at $40. A customer visiting your store wants to purchase a T-shirt from this collection, but they are choosing to shop in GBP. They can’t remember the name of the product they are looking for, but they remember that the price was a little over £30 when converted to GBP.

If your store doesn’t offer the option to filter by price ranges, the customer will either now have to search through your product catalog to find the products they are looking for, or, more likely, abandon their search and shop elsewhere. However, if you offer the option to filter by price range, your customer can filter the catalog by a range of £30–40, narrowing the search considerably and helping them to find the products they want.

To make products with variable prices more discoverable

A WooCommerce price filter is perfect for eCommerce stores that sell the same products at variable prices, such as stores that offer variable pricing based on quantity or user role. For example, if your store offers a wholesale discount on certain product lines, the option to filter by a price range will improve the discoverability of these products, as both the regular and wholesale prices will show up in the results when you filter by price range.

In the same way, the option to filter by a price range is also ideal for stores offering variable products, where the pricing is different for each variation. Returning to our T-shirt store example, you might offer a particular style of T-shirt in different colors, with different pricing for each color. 

A price range filter here would make your variable ‘Round-neck T-shirt’ product much more discoverable, as the product would appear in all filtered searches where the price range covered the price of at least one variant.

The problem with the default WooCommerce price filter

WooCommerce provides a basic price filter widget out of the box, but it has some limitations when it comes to functionality and flexibility. Some of the main issues with the default WooCommerce price filter include:

• It doesn’t use AJAX: The WooCommerce price filter, by default, reloads the page every time a customer selects a new price range to filter by. This slows down the purchasing journey, making for a worse overall experience and increasing the chance that your customers will abandon their purchases before checkout. For this reason, fast filtering using AJAX filters is the standard for eCommerce stores and is a must for any store owners looking to offer a great customer experience.

• It has limited display options: The default WooCommerce price widget can only appear in the sidebar widget area and not above the list of products. This makes it easier for customers to miss.
• It’s quite fiddly to use: The WooCommerce price widget isn’t very intuitive from a technical standpoint. There are no boxes indicating the price ranges chosen by shoppers on the price slider, which makes them less visually accessible and detracts from the filtering experience.

WooCommerce’s built-in price filtering options are also limited in other ways. For example, you can’t display a category filter above your WooCommerce price filter. This is a significant disadvantage as planning and organizing all your filters together allows for the best possible experience for customers.

Considering these drawbacks, the best way to add a WooCommerce price filter to your online store is to install a third-party filter plugin. We’ll take a look at one of the best options available now.

Which WooCommerce price filter plugin should you use?

As we’ve already covered, filtering by price can bring huge benefits to your store from a user experience perspective. When it comes to choosing a product filter plugin, there are many different options available, though many lack the ease of use and advanced feature set that you’ll need to take your store’s user experience to the next level.

One option that ticks all of the boxes when it comes to both functionality and ease of use is WooCommerce Product Filter from Premmerce. This plugin offers a wide range of filtering options, an intuitive and attractive display, and is easy to set up, with no coding knowledge required. Let’s take a closer look at some of the features that make it one of the best product filter plugins on the market:

An advanced WooCommerce price filter

• WooCommerce Product Filter adds a price slider that has a meter to set low and high prices to filter your product catalog. Shoppers can search for products falling within a minimum and maximum price range. The high and low values appear in boxes above the slider.
• Unlike the default WooCommerce price widget, the WooCommerce Product Filter price filter can appear either above the list of products or in the sidebar, giving you full control over the appearance of your shop and archive pages.
• All filters powered by WooCommerce Product Filter support AJAX search, meaning that the product catalog will update without a page refresh when the customer sets the price filter to show relevant products only.

Sort by price

WooCommerce Product Filter also lets you add a product sort dropdown to your shop pages to allow users to sort the product catalog by price (high to low or low to high). The product sort dropdown can appear above the list of products or in the sidebar.

A complete set of other product filters

In addition to a robust price filter, you can create filters for categories, attributes, colors, tags, custom taxonomies, ratings, stock status, and on-sale products. This way, you can let users filter products in a variety of different ways.

Combining a price filter slider widget with other filter types (like dropdowns, checkboxes, or radio buttons) makes it easier for customers to find exactly what they’re looking for and get to the correct product page faster. For example, if someone is looking for a red t-shirt between $40 and $50, they can quickly filter products to see only those products that fit those specifications:

• Category: T-shirts
• Colors: Red
• Price: $40 to $50

Generate SEO-friendly landing pages

WooCommerce Product Filter also enables store owners to bulk generate SEO-friendly landing pages based on filter results to help aid product discoverability. Match descriptions to the content of the pages and create pages that coordinate with the attributes and names of real products, along with a readable URL and appropriate content semantics. You can even formulate unique meta tags, such as title, H1, description, and keywords for each page based on the current parameters of the filter.

How to add a price filter to your WooCommerce store with WooCommerce Product Filter (Step-by-Step)

You can set up a price filter for your eCommerce store with WooCommerce Product Filter in a few simple steps. As we’ve covered, the plugin supports an entire range of advanced filters, so by getting the plugin set up on your store, you will open up the possibility for your customers to filter your product catalog by a range of attributes and other taxonomies. Installing the plugin requires no coding knowledge, but if you wish to make further style changes to your filters, you can use custom CSS.

Let’s walk through the steps of setting up an advanced price filter using the WooCommerce Product Filter plugin from Premmerce: 

1. Download and install the plugin – it is available from the WordPress plugin repository, or you can purchase it directly from Premmerce.

2. From the WordPress admin area, navigate to Premmerce > Product Filter > Settings, then check the ‘Show price filter’ box.

3. Configure any additional options. For example, you can check the ‘Use AJAX’ button to enable all of the filters you create with WooCommerce Product Filter to apply without the need to load the page.

4. Once you’re done, hit ‘Save changes’. A price filter will now appear on your shop and archive pages.

Tips to improve the user search experience on your store

The user experience of your WooCommerce store plays a vital role in the success of your business. Adding a price filter is one easy way to improve the customer experience, but this is only the first step. Let’s take a look at some other best practices to help create a simple yet engaging shopping experience.

Use advanced filters

Alongside filtering by price, enabling filtering by attributes like rating, product color, and stock status makes the product search experience on your WooCommerce store more efficient. When people can shop as they choose, they will stay on your site for longer, decreasing your bounce rate. And, if they are able to find the products they want more efficiently, they will be less likely to abandon their search, leading to a higher conversion rate.

Use high-quality product images

High-resolution images are the standard for eCommerce. Blurry and pixelated product photos are a surefire way to create a poor impression of your WooCommerce products, losing customer trust and reducing the likelihood that they will convert. Your images should clearly show the product from as many angles as possible, and you should ensure you avoid distracting backgrounds or poor cropping. This will help to create a positive perception of your product catalog, which in turn can help encourage shoppers to add your products to their carts.

Write better product descriptions

High-quality photos and succinct, informative copy make a powerful combination when it comes to boosting conversions. Make sure that all your product descriptions are accurate, engaging, and written in a persuasive but not hyperbolic style. Include both short and long product descriptions – the short description should give a quick overview of the product and its main features, while the long description can go into more depth about details like the product manufacturing process and the materials used.

Optimize your site’s search experience

WooCommerce’s default search experience, much like its default filtering functionality, can be vastly improved with the use of supplementary plugins. Using WooCommerce Product Search from Premmerce, you can create a much better search experience for your customers by adding new features such as search suggestions as you type, spelling correction, live search previews including product images and descriptions, and an add-to-cart button in search results preview.

This serves to make the search experience for your eCommerce store much more efficient, reducing the number of steps between a customer landing on your website and completing their purchase, which in turn can help to boost your conversion rate and reduce cart abandonment.

Give shoppers an easy way to find products

A WooCommerce price filter allows shoppers to set minimum and maximum price ranges and quickly find products within their budgets. This functionality is best implemented using the WooCommerce Product Filter plugin from Premmerce. Here’s a quick reminder of some reasons why this plugin is the best WooCommerce product filtering solution on the market:

• The price slider is easy and intuitive to use, and can be placed wherever you need it on your shop and archive pages
• Instant filtering can be enabled with AJAX, making for a more efficient search experience on your online store
• The plugin can be installed in a matter of minutes, enabling you to start improving your site’s user experience right away
• Alongside price filtering, the plugin offers other advanced filters, including filtering by stock, tags, categories, and more
• While you don’t need any coding knowledge to get started, those with CSS experience can style their filters’ appearance however they like using custom CSS

Create custom product filters in no time at all. Get started with WooCommerce Product Filter today and level up the user experience for your eCommerce store.