# 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.

- Type: PHP
- Runs: Run everywhere
- Category: [Widgets](https://wpide.com/library/category/widgets/)
- Requires: WooCommerce
- Tags: woocommerce, widgets, filters
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/woo-shop-filters-widget-area/

## Code

```php
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 use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Filters Widget Area Above the Shop" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/