Shop filters for the product archive: categories, price, rating, stock, sale and A to Z. It comes with Bright Addons Blocks Pro, which also includes every free block.
Live demo
This is the block itself with its starting settings. Change any of them in the block sidebar.
What you can set
The Product Filter block has 1 settings panels. No code needed.
Set layout, Grid CSS ID, Apply filters, Button text, Button icon, Icon position, Show chosen filters, "Clear all" text, Sections can be closed and 4 more settings.
How to use it
Settings
The full list, panel by panel, is in the Product Filter guide.
| Setting | What it does | Choices |
|---|---|---|
| Layout (Behaviour) | Use one of each on the same page if you like: a top bar above the grid and a sidebar next to it. | Sidebar: sections under each other, Top bar: a row of dropdown buttons |
| Grid CSS ID (Behaviour) | Only needed with several grids on one page: the CSS ID set in the grid's Advanced tab. Empty: the first grid on the page. | – |
| Apply filters (Behaviour) | Choose one. | At once, With a button |
| Button text (Behaviour) | Text you type. | – |
| Button icon (Behaviour) | Icon picker. | – |
| Icon position (Behaviour) | Choose one. | Before, After |
| Show chosen filters (Behaviour) | On or off. | – |
| "Clear all" text (Behaviour) | Text you type. | – |
| Sections can be closed (Behaviour) | On or off. | – |
| "Show more" text (Behaviour) | Text you type. | – |
| "Show less" text (Behaviour) | Text you type. | – |
| Fold behind a button on small screens (Behaviour) | Choose one. | Never, On phones, On tablets and phones, On every screen |
| Button text (Behaviour) | Text you type. | – |
Questions
Product Filter is a Pro block. It comes with Bright Addons Blocks Pro, which has the same plans and prices as Bright Addons Pro for Elementor and includes all 62 free blocks.
Yes. This block shows WooCommerce data, so WooCommerce must be active. Without it, the block shows nothing on the page.
No. It is a block for the WordPress block editor (Gutenberg). Elementor is not needed. If you use Bright Addons Pro for Elementor on the same site, both plugins work side by side.
No. Each block loads only its own small CSS and JavaScript, and only on pages where it is used. Blocks you do not need can be switched off in Bright Blocks.
Yes. The blocks work with block themes and classic themes, and follow your theme fonts. Wide and full width alignment are supported.
More blocks
Bright Addons Blocks
Blocks Pro has all 99 Pro blocks, the 62 free blocks, Pro effects for every block, Theme Templates and popups.