Filters in the block editor
Super Speedy Filters ships blocks, so you can drop a filter straight into a page, a post or a block-theme template and see it render as you configure it — no widget screen, no shortcode.
Available since 6.41. The classic widgets still work exactly as they did; nothing needs migrating.
Why this matters on a block theme
Block themes have no widget areas of their own. Without blocks, the only way to get a filter onto a block-theme site is to put a widget into one of Super Speedy Filters’ own shortcode areas and then pull it into a template with [ssf_widgets] — two screens, two saves, and no way to see what it looks like until you load the front end.
With blocks, a filter is a block like any other.
The blocks
| Block | What it is |
|---|---|
| Super Speedy Filter | The main one — any taxonomy or product attribute |
| Super Speedy Filter Group | Puts several filters behind a single button |
| Super Speedy Price Filter | Price range (WooCommerce) |
| Super Speedy Stock Filter | In-stock only (WooCommerce) |
| Super Speedy On Sale Filter | On-sale only (WooCommerce) |
| Super Speedy Active Filters | The filters a shopper has selected, with a clear-all link |
| Super Speedy Postmeta Filter | Filter on a custom field |
They live under Super Speedy Filters in the block inserter.
Ready-made filters
Rather than inserting an unconfigured shell, the inserter offers three variations that work immediately:
- Product Categories (tree) — hierarchical categories as an expandable tree
- Brands (images) — brand filter using your brand logos
- Colour swatches — circular swatches for a colour attribute
Search “Super Speedy” in the inserter and they appear alongside the blocks.
Configuring a filter
Select the block and use the sidebar. Settings are grouped:
- Source — post type, then taxonomy. The taxonomy list updates as soon as you change the post type, and each option shows how many terms it has.
- Display — title, display type, hierarchy (only shown for hierarchical taxonomies), container, multi-select, counts, search box.
- Colours — appears only for the colour display types. Lists your terms with a colour picker each, and a Use those colours button that fills them in from colours already saved against your terms.
- Behaviour — visibility, Ajax loading for popouts, items per page, whether the filter respects other filters, what it does on search pages.
- Advanced — selected-option handling, term include/exclude lists, extra CSS classes.
When you pick a taxonomy with more than 100 terms, the sidebar says so and suggests a search box and a popout container. A 250-term filter rendered flat on the page is one of the few ways to make a Super Speedy Filters site feel slow.
The preview is the real thing
The block shows your actual filter with your actual terms and counts, rendered by the same code that renders your front end. Change the display type and it re-renders. There is no mock-up to drift out of date.
Two things behave differently in the editor, on purpose: nothing is shown as selected (there is no shopper session), and the preview is not clickable, so a stray click cannot navigate you out of the editor.
Putting filters in a template
On a block theme, open the Site Editor and add filter blocks wherever you want them — a template, a template part, or beside a Query Loop.
If you want the usual shop layout — filters on the left, products on the right — the quickest route is Auto Configure, which will build that two-column layout for you and can undo it again. You can then adjust the individual blocks in the Site Editor as normal.
Inside a Query Loop, a filter block defaults its post type to whatever the loop is querying, so a filter dropped into a posts loop starts out filtering posts rather than products.
The Super Speedy Filter Group block holds several filters and shows a single button. Useful on mobile, or when you have more filters than fit comfortably in a sidebar. Set the button label, the style (popout or popover) and the icon in the block sidebar, then add filter blocks inside it.
Widgets still work
Every classic widget is still registered and still works. If your site uses widgets today, nothing changes and nothing needs converting. Blocks are an additional way to place filters, not a replacement.
You can mix them: widgets in a classic sidebar, blocks in a template, both on the same site.
On a classic theme, widgets are still the simplest option and there is no reason to move. On a block theme, use blocks — the widget path there means a shortcode indirection you do not need.
If a filter block shows nothing
A filter with nothing to show renders nothing at all, by design. Usually one of:
- The taxonomy has no terms with content. A filter can only offer terms that have products.
- The filter is set to Admins only. New filters start that way so shoppers do not see half-configured filters; switch it to Enabled under Behaviour when you are ready.
- You are looking at a page with no products of that type.
- Required filters are set and the shopper has not selected them yet — see Conditional filters.
Comments