The Filter by Price block lets customers narrow a WooCommerce product listing to a specific price range using an interactive slider.
It is designed to work with Blocksy’s Product Filters system and can be placed in supported widget areas, filter canvases or other suitable block-based shop layouts.
Blocksy Pro required
The Filter by Price block is part of the Product Filters module included with Shop Extra. WooCommerce, Blocksy Companion Pro and a Business or Agency plan are required.
Getting Started
Before adding the Filter by Price block, enable the Product Filters module:
- Navigate to WordPress Dashboard → Blocksy → Extensions.
- Locate and expand the Shop Extra extension.
- Enable the Filters module.
- Open the block editor for the shop area where you want to display the price filter.
- Search for Filter by Price in the block inserter and add it to the layout.
The block automatically determines the relevant product price range from the current WooCommerce query and updates the displayed products as customers refine the minimum and maximum values.
Granular Controls
Show Tooltip
Enable Show Tooltip to display the current value next to the slider handle while the customer adjusts the selected price range.
Show Prices
Enable Show Prices to display the currently selected minimum and maximum prices underneath the slider.
Price Input Fields
The block can also display dedicated minimum and maximum price fields, allowing customers to enter an exact price range instead of relying only on the slider controls.
The input fields remain synchronised with the slider, so changing either control updates the selected range accordingly.
Show Reset Button
Enable Show Reset Button to provide a quick way to clear the selected price range and return the listing to its default price-filtering state.