Responsive design is the practice of designing a website so it looks and works properly on a range of different devices — particularly mobile phones and tablets as well as desktops and laptops.
The WooCommerce Product Filter by WooBeWoo plugin is fully responsive and will look great on any device, while if necessary, you can customize the adaptability of elements for each condition, without programming knowledge.
With WooBeWoo, you can be sure that your filter will look and work great on mobile devices. The UX of the mobile adaptive is thought out to the smallest detail by default, and thanks to the widest adaptability settings, you get unlimited extra possibilities:
- Set a breakpoint for all settings that depend on mobile or desktop. That is, from how many pixels the filter will perceive the device as mobile.
- Hide the Titles of the desired filter blocks for mobile and desktop devices.
- Use the filter in the popup exclusively for mobile or desktop devices. Moreover, you can set unique popup behavior for each device.
- Limit the display of the filter to only mobile or only desktop devices.
You can set the same filter to behave differently depending on the device. For example:
- Show a classic filter on a desktop, but at the same time on a mobile device a filter in a pop-up with hidden blocks.
- Use the Float “Hide Filter” button on mobile which will be closed by default. And at the same time, on the desktop, display an expanded button without floating mode.
- Turn on the accordion mode (when the block is hidden, or open with the ability to hide) for filter blocks for each device separately.
- If you need radically different parameters on different devices, then you can create two filters and show the first one only on desktop and the second one only on a mobile.
Check out our detailed documentation to learn more about setting up a product filter.