Filters Widget Area Above the Shop
Registers a "Shop Filters" widget area and shows it above the product grid on shop and category pages, a natural home for price, attribute and rating filters.
Opens WPIDE on
Code
add_action( 'widgets_init', function () {
register_sidebar( array(
'name' => 'Shop Filters',
'id' => 'wpide-shop-filters',
'description' => 'Shown above the products on shop and product category pages.',
'before_widget' => '<div id="%1$s" class="widget %2$s" style="flex:1 1 200px;">',
'after_widget' => '</div>',
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
} );
add_action( 'woocommerce_before_shop_loop', function () {
if ( ! is_active_sidebar( 'wpide-shop-filters' ) ) {
return;
}
echo '<div class="wpide-shop-filters" style="display:flex;flex-wrap:wrap;gap:1.5em;margin:0 0 1.5em;">';
dynamic_sidebar( 'wpide-shop-filters' );
echo '</div>';
}, 35 );Notes
Works with classic WooCommerce shop templates. Block-based shop templates should use the Product Filters blocks instead.
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.