General information

The following modes are available:

1. Mobile resolutions can only have a bottom-aligned filter bar.
2. Desktop resolutions can have:
   1. The bar filters which will be created when you use only AJAX widgets and if they can fit that area.
   2. The panel which will be created when you use only AJAX widgets and if they can't fit the bar.
   3. The sidebar which is created automatically when you use any non-AJAX widgets in that area.

Configuration

To configure your mobile and desktop shop filters follow the steps:

1. Go to Administration → Appearance → Widgets.
2. Add the same widgets to both "Shop Widget Area (desktop)" and "Shop Widget Area (mobile)":
   1. AJAX Product Filters: Category
   2. AJAX Product Filters: Color (Operator: OR)
   3. AJAX Product Filters: Size (Operator: OR)
   4. AJAX Product Filters: Price range
3. Optionally you can use the default WooCommerce widgets instead:
   1. Product Categories
   2. Filter Products by Attribute: Color (Query type: OR)
   3. Filter Products by Attribute: Size (Query type: OR)
   4. Filter Products by Price

Color circles can be enabled using BLK Color Filters plugin.