The Filters Canvas area introduces a modern and user-friendly approach to showcasing product filtering options on your WooCommerce store. This innovative feature designates a dedicated area that remains hidden upon initial page load, contributing to a cleaner and more streamlined shop page design. With a simple click, visitors can effortlessly reveal the filters, empowering them to refine their product selections based on their specific needs.
Mobile-First Optimisation –
The design priorities user experience, particularly on mobile devices where screen space is limited. By keeping filters initially concealed, it ensures a clutter-free browsing experience on smaller screens, while still providing easy access to powerful filtering functionalities when needed.
To activate the “Filters Canvas” functionality, ensure that the “Filters” module within the “Shop Extra” Blocksy extension is switched on. Navigate to Blocksy’s main Extensions dashboard and locate the “Shop Extra” extension to activate the module.
Granular Controls
Canvas Area Design
- Choose from two stylish designs: Select between the sleek “Slide Out Panel” or the elegant “In-Line Revealing Pane” to match your aesthetic preferences and ensure seamless integration within your shop page layout.
Icon & Label Controls
- Customise the trigger button: Define the visual style of the button icon that triggers the canvas reveal, and configure its visibility on various devices (desktop, tablet, and mobile) to cater to a diverse range of users.
- Craft a clear call to action: Craft a concise and informative label for the button, guiding visitors towards utilizing the filter options effectively.
Panel Controls
- Fine-tune the panel appearance: Depending on your chosen design (Slide Out or In-Line), this section allows you to control dimensions (width/height) and reveal direction (left/right) for the slide-out panel, or specify the number of columns and default open/closed state for the in-line pane.
AJAX Reveal
- Experimental AJAX Reveal: This experimental feature aims to optimise page load times by loading filter content dynamically upon panel reveal. While still under development, it provides additional optimisation potential, but is currently certified to work best with Blocksy Pro’s built-in shop filters.
Widget Content Source
- Widget Content Source: Specify the desired widget area that serves as the source for filter widgets displayed within the canvas area on the front-end of your website.