在電商網(wǎng)站中，當(dāng)商品數(shù)量和分類越來(lái)越多時(shí)，提供便捷的篩選功能成為提升購(gòu)物效率的重要方式。Blocksy 推出了一套全新的產(chǎn)品篩選 Gutenberg 區(qū)塊，幫助網(wǎng)站更好地管理豐富的商品分類、屬性、品牌信息以及價(jià)格區(qū)間，提升整體頁(yè)面表現(xiàn)力和顧客的購(gòu)物便捷性。

產(chǎn)品篩選模塊簡(jiǎn)介

Blocksy 的產(chǎn)品篩選模塊屬于 Shop Extra 擴(kuò)展的一部分，為 Blocksy Pro（Professional 或 Agency 套餐）用戶開放。模塊基于 Gutenberg 編輯器，具備靈活易用的特性，支持快速添加多種類型的篩選器，包括分類篩選、屬性篩選、品牌篩選和價(jià)格篩選。

設(shè)置流程

在 WordPress 后臺(tái)，進(jìn)入外觀 → 小工具，選擇對(duì)應(yīng)的 WooCommerce 側(cè)邊欄區(qū)域，開始添加篩選器區(qū)塊。

添加價(jià)格篩選器

• 搜索并添加價(jià)格篩選區(qū)塊

• 價(jià)格篩選包含兩個(gè)子區(qū)塊：標(biāo)題和篩選控件

• 可以啟用提示功能，顯示顧客拖動(dòng)價(jià)格區(qū)間時(shí)的小數(shù)值彈窗
• 支持展示當(dāng)前選擇的價(jià)格范圍
• 可開啟重置按鈕，方便顧客一鍵恢復(fù)完整商品列表

添加分類篩選器

• 搜索并添加產(chǎn)品篩選區(qū)塊

• 在設(shè)置中選擇以分類、標(biāo)簽、品牌或自定義分類法進(jìn)行篩選

• 支持多項(xiàng)選擇

• 可以啟用搜索框，方便快速定位篩選項(xiàng)

• 支持顯示勾選框、父子分類層級(jí)、每個(gè)篩選項(xiàng)下的商品數(shù)量

• 可手動(dòng)排除不想顯示的分類
• 提供重置篩選按鈕，方便恢復(fù)初始狀態(tài)

添加品牌篩選器

• 操作方式與分類篩選類似
• 支持顯示品牌圖標(biāo)，提升品牌辨識(shí)度

• 可以關(guān)閉文字標(biāo)簽，僅保留品牌圖標(biāo)展示

添加屬性篩選器

• 在篩選設(shè)置中選擇具體的產(chǎn)品屬性
• 可開啟屬性圖標(biāo)（Swatches）展示，如顏色塊或圖案，提升視覺直觀度

頁(yè)面展示效果

前端頁(yè)面上，顧客可以：

• 拖動(dòng)價(jià)格滑塊，快速篩選符合價(jià)格范圍的商品

• 按分類、品牌或?qū)傩詶l件多重篩選，組合出精準(zhǔn)結(jié)果

• 輕松查看已應(yīng)用的篩選條件，并可以單獨(dú)取消某一項(xiàng)，或一鍵重置全部篩選

篩選器模塊支持同時(shí)顯示在側(cè)邊欄或產(chǎn)品列表頂部區(qū)域，方便根據(jù)網(wǎng)站布局靈活調(diào)整。

篩選重置功能

Blocksy 還提供了篩選狀態(tài)管理功能。在產(chǎn)品歸檔頁(yè)面設(shè)置中，可以啟用“當(dāng)前篩選條件”區(qū)域，讓顧客清晰看到已應(yīng)用的篩選條件，并支持單獨(dú)取消或一鍵重置所有條件，進(jìn)一步優(yōu)化購(gòu)物流程。

總結(jié)

Blocksy 的產(chǎn)品篩選器模塊，為電商網(wǎng)站提供了靈活、美觀且功能豐富的商品篩選系統(tǒng)。無(wú)論是按照價(jià)格、分類、品牌還是屬性，均可以快速搭建專業(yè)級(jí)的篩選體驗(yàn)。模塊設(shè)置直觀簡(jiǎn)單，能夠有效提升商品瀏覽效率和顧客滿意度，適合各類需要強(qiáng)化商品展示與篩選功能的電商平臺(tái)使用。

最近更新

聯(lián)系我們
教程看不懂？聯(lián)系我們?yōu)槟赓M(fèi)解答！免費(fèi)助力個(gè)人，小企站點(diǎn)！	客服微信
① 電話：020-2206-9892
② QQ咨詢：1025174874
③ 郵件：info@361sale.com
④ 工作時(shí)間：周一至周五，9:30-18:30，節(jié)假日休息