Blocksy Product Filter Module to Optimize Ecommerce Website Shopping Experience

In e-commerce websites, when the number and categorization of products are increasing, providing convenient filtering functions becomes an important way to improve shopping efficiency.Blocksy Introduced a new set of product screening Gutenberg Blocks to help websites better manage rich product categorization, attributes, brand information, and price ranges, improving overall page presentation and customer shopping convenience.

Image[1]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

Product Filtering Module Introduction

Blocksy's Product Filtering module is part of the Shop Extra extension for Blocksy Pro(Open for users of the Professional or Agency packages. The modules are based on Gutenberg The editor, with its flexible and easy-to-use features, supports the quick addition of many types of filters, including category filters, attribute filters, brand filters and price filters.

Setup Process

exist WordPress Backend, go to Appearance → Gadgets and select the corresponding WooCommerce Sidebar area, start adding filter blocks.

Image [2]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

Add Price Filter

  • Search and add price filter blocks
Image [3] - Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • The price filter consists of two sub-blocks: the header and the filter control.
Image [4] - Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • You can enable an alert feature that displays a small value pop-up window when the customer drags the price range.
  • Support for displaying the currently selected price range
  • Reset button can be turned on, so that customers can restore the complete product list with one click
Image [5]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

Add Category Filter

  • Search and add product filter blocks
Image [6]-Blocksy Product Filtering Module to optimize the shopping experience of e-commerce websites
  • Choose to filter by category, tag, brand or custom taxonomy in the settings
Image [7]-Blocksy Product Filtering Module to optimize the shopping experience of e-commerce websites
  • Supports multiple selections
Image [8]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • Search box can be enabled to quickly locate filtered items
Image [9]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • Supports display of checkboxes, parent-child category hierarchy, number of products per filter item
Image [10]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • You can manually exclude categories you do not want to display
  • Provide a reset filter button to facilitate the restoration of the initial state
Image [11]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

Add Brand Filter

  • The operation is similar to the sorting and filtering
  • Supports the display of brand icons to enhance brand recognition
Image [12]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • Text labels can be turned off to keep only the branded icon display
Image [13]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

Adding Property Filters

  • Select specific product attributes in the filter settings
  • Swatches can be enabled, such as color blocks or patterns, to enhance visual intuition.
Image [14]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

Page display effect

On the front end page, customers can:

  • Drag the price slider to quickly filter items that match the price range
Image [15]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • Multi-filter by category, brand or attribute conditions to combine precise results
Image [16]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
  • Easily view applied filters and cancel an item individually or reset all filters with one click!

The filter module supports simultaneous display in the sidebar or in the top area of the product list for flexible adjustment to the site layout.

Filter Reset Function

Blocksy Filter status management is also provided. In the product archive page settings, you can enable the "current filter conditions" area, so that customers can clearly see the filter conditions have been applied, and support for individual cancellation or one-click reset all the conditions, to further optimize the shopping process.

Image [17]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience
Image [18]-Blocksy Product Filtering Module to Optimize Ecommerce Website Shopping Experience

summarize

Blocksy s Product Filter module provides a flexible, beautiful and feature-rich product filtering system for e-commerce websites. Whether by price, category, brand or attribute, you can quickly build a professional-level filtering experience. The module is intuitive and simple to set up, and can effectively improve the efficiency of product browsing and customer satisfaction, suitable for all kinds of e-commerce platforms that need to strengthen the product display and screening functions.

Recent Updates


Contact Us
Can't read the tutorial? Contact us for a free answer! Free help for personal, small business sites!
Customer Service
Customer Service
Tel: 020-2206-9892
QQ咨询:1025174874
(iii) E-mail: info@361sale.com
Working hours: Monday to Friday, 9:30-18:30, holidays off
© Reprint statement
This article was written by: thieves will be rats and mice courage
THE END
If you like it, support it.
kudos1437 share (joys, benefits, privileges etc) with others
commentaries sofa-buying

Please log in to post a comment

    No comments