[ad_1]
經營網上商店 可能具有挑戰性。 您需要組織您的產品，以便客戶可以找到他們正在尋找的商品。 幸運的是，WooCommerce 產品過濾器塊可以在幾秒鐘內分組和顯示用戶指定的項目。
使用產品過濾器塊，您可以根據 WooCommerce 商店商品的特徵來組織它們。 這些可能包括它們的價格、類別、屬性或標籤。 然後，您只需將塊插入帖子或頁面，您的客戶就可以找到過濾後的結果。
在本指南中，我們將介紹所有不同的 WooCommerce 產品過濾器塊，並討論您可能考慮使用它們的原因。 然後，我們將解釋如何在您的在線商店中插入和配置這些元素。 讓我們開始吧！
📚 目錄：
#WooCommerce #product 過濾器塊🌪️🧱它們是什麼以及如何使用它們
WooCommerce 產品過濾器塊介紹
WooCommerce 擁有一系列 WooCommerce 塊 旨在讓用戶在您的在線商店中搜索特定產品。 這些互動式元素使消費者能夠過濾他們的結果並找到最適合他們需求的項目。
以下是免費 WooCommerce 產品過濾器塊的快速概述：
- 按價格篩選產品：此塊使客戶能夠使用滑塊選擇價格範圍並僅顯示適合該範圍的商品。
- 按屬性過濾產品：它允許客戶根據其屬性搜索商品，包括尺寸、顏色和樣式。
- 活動產品過濾器：它可以幫助客戶查看他們已經在搜索中應用了哪些過濾器，以便他們可以調整它。
- 按庫存篩選產品：此塊僅顯示有庫存、缺貨或延期交貨的項目。
您可以在帖子、頁面和小部件區域使用這些塊。 與塊交互時，客戶將能夠從預定參數中進行選擇以查看過濾結果。
👉如果您想要更靈活地設置產品過濾器，您還可以安裝專用的 WooCommerce 產品過濾器插件。 我們將在本文後面分享一些質量選項。
為什麼您可能會考慮使用 WooCommerce 產品過濾器塊
WooCommerce 產品過濾器塊可以顯著提高 用戶體驗（UX） 您的在線商店。 如果您擁有豐富的產品目錄，客戶可能會花費數小時滾動瀏覽您的商品，同時尋找適合他們需求的商品。 然而，他們可能會感到沮喪並點擊離開去其他地方購物。
藉助商品過濾器，您可以讓消費者根據特定參數搜索商品。 您可能已經在領先的電子商務商店頁面上看到過此功能：
根據您銷售的商品，產品過濾器使客戶能夠瀏覽您的商店以查找適合他們需求的顏色、尺寸、成分和品牌。 此外，結果將在同一頁面上更新。 因此，消費者無需導航到類別頁面並中斷他們的購物體驗。
如何使用 WooCommerce 產品過濾器塊
在第一部分中，我們將向您展示如何使用 WooCommerce 自動包含的默認產品過濾器塊。 同樣，為了獲得更大的靈活性，您可以考慮下一節中的一個 WooCommerce 產品過濾器插件。
大多數 WooCommerce 產品過濾器塊的工作方式相同。 您只需插入塊，然後確定顯示哪個產品特徵。
您可以在 WordPress 中找到所有這些塊，方法是單擊 + 按鈕插入新塊並搜索「WooCommerce 過濾器：」
請記住，您首先需要為您的 WooCommerce 產品添加屬性、標籤、類別和其他特徵。 否則，您將沒有任何數據可在您的塊中使用。
現在，讓我們看看如何使用 WooCommerce 產品過濾器塊。 我們將使用 Filter Products by Attribute 元素作為示例。
第 1 步：為您的 WooCommerce 產品添加屬性
ℹ️ 注意 – 對於其他過濾器（例如價格或庫存），您不需要設置任何屬性。
如果您還沒有這樣做，您需要將類別、標籤和屬性添加到您的 WooCommerce 產品中。 這些分類法使客戶更容易找到他們想要的物品。 此外，如果沒有這些分類，WooCommerce 產品過濾器塊將無法工作。
首先導航到 WordPress 儀錶板中的產品 > 屬性。 在這裡，您可以為您的產品創建新的分類。 如您所見，我們的在線商店中已經有顏色和尺寸：
您需要為新屬性輸入名稱和 slug。 然後，單擊添加屬性以保存分類。 請注意，您可以對產品類別（和子類別）和標籤遵循相同的流程。
然後，打開您的產品以添加其分類法。 您可以通過導航到產品 > 所有產品並單擊一個項目來執行此操作。
現在，向下滾動到產品數據部分並打開屬性菜單：
您可以通過從下拉菜單中選擇屬性並單擊添加來為您的產品添加屬性。 然後，選擇屬性旁邊的下拉箭頭以輸入您的自定義信息。
例如，在我們的示例中，我們將 Red 作為 Color 屬性添加到我們的產品中：
添加所有變數後，單擊保存屬性。 現在，客戶將能夠通過您的 WooCommerce 產品過濾器塊找到具有這些特徵的商品。
第 2 步：插入您的產品過濾器塊
接下來，您需要打開要使用產品過濾器塊的頁面或帖子。 您還可以考慮在商店頁面的側邊欄中使用該元素，以便客戶可以在瀏覽時過濾他們的結果。
首先，您需要將所有產品塊添加到您的頁面。 否則，WooCommerce 將無法過濾和顯示特定項目。
您可以通過單擊 + 按鈕並搜索「所有產品」來執行此操作。 選擇塊並將其添加到您的頁面：
接下來，搜索「WooCommerce 過濾器屬性：」
單擊該塊，它將被插入到您的頁面中。 現在您可以搜索產品屬性或從下拉列表中選擇一個。 我們將在示例中使用 Color：
您的塊現在將被轉換以顯示新標題和您選擇的產品屬性列表（例如不同的項目顏色）：
如果您喜歡它的外觀，您可以保持原樣。 或者，在下一步中，我們將討論如何自定義此元素的外觀。
步驟 3：配置塊設置
接下來，您可以自定義 WooCommerce 產品過濾器塊的外觀。 只需單擊按屬性篩選產品塊，然後選擇右側的齒輪圖標：
在這裡，您可以選擇是否顯示您的產品數量。 如果您有大量商品目錄並希望為您的客戶提供廣泛的選擇範圍，此設置可能會很方便。
您還可以為您的產品屬性選擇標題級別。 默認值為 H3，但您可以從 H2 到 H6 中進行選擇，以滿足您商店的風格需求。
如果向下滾動，您應該會在「塊設置」下看到一些附加配置：
在這裡您可以選擇您的查詢類型。 如果您選擇 And，WooCommerce 將僅顯示包含所有客戶指定屬性的產品。 同時，Or 選項將顯示至少具有其中一個屬性的所有項目。
在顯示類型下，您可以選擇以列表或下拉格式顯示您的屬性。 這兩個選項都相對用戶友好。
最後，您可以選擇啟用過濾器按鈕。 如果您打開它，客戶將需要單擊「Go」來過濾他們的搜索結果。 但是，如果您不使用它，只需選擇其中一個屬性即可更新顯示的產品。
而已！ 您的 WooCommerce 產品過濾器塊現已準備就緒：
只需保存並發布您的更改。 客戶現在可以使用特定屬性過濾他們的產品搜索。
WooCommerce 產品過濾器插件概述
除了免費的 WooCommerce 塊之外，您還可以訪問第三方插件以增加設置過濾器的靈活性。 例如， WooCommerce 產品搜索插件 包含以下過濾器選項：
- 產品：顯示過濾產品的集合。 此塊可以複製您的商店頁面並在同一頁面上呈現由其他產品過濾器塊控制的項目。
- 搜索：為您的 WooCommerce 商店創建過濾搜索功能。
- 類別：顯示與特定類別相對應的產品，例如服裝類型或性別。
- 屬性：顯示具有特定屬性的產品，例如顏色、品牌、尺寸、形狀、製造或特定功能。
- 標籤：顯示與產品標籤相對應的產品，包括「特色」、「徽標」或「趨勢」。
- 價格：顯示指定價格參數內的產品。
- 評分：根據產品的平均評分展示產品。
- 銷售：僅顯示正在銷售的產品。
- 庫存：僅顯示有庫存的產品。
- 重置：使客戶能夠重置產品過濾器參數。 然後，他們可以查看您所有可用的項目或輸入新設置來自定義他們的搜索。
👉 或者，您可以考慮使用 WooCommerce 插件的 WOOF 產品過濾器：
WOOF – WooCommerce 的產品過濾器當前版本：1.2.7
最後更新：2022 年 5 月 31 日
woocommerce-products-filter.zip
4.9.0需要
使用此插件，客戶可以根據商品的類別、屬性、標籤、自定義分類法和價格過濾商品。 此外，顯示的結果通常比默認的 WooCommerce 塊更具吸引力和可定製性。
WooBeWoo 的產品過濾器當前版本：2.1.4
最後更新：2022 年 5 月 26 日
3.4.0需要
WooBeWoo 的 WooCommerce 產品過濾器是另一個出色的免費增值選項：
您可以單獨使用它或與 Elementor 一起使用它來設計自己的產品過濾器和布局條件。 這 高級插件 包括附加功能，例如類別圖標、自定義樣式和隱藏/顯示過濾器按鈕。
立即開始使用 WooCommerce 產品過濾器
WooCommerce 產品過濾器塊使客戶能夠在您的商店中搜索具有特定特徵的商品。 否則，用戶將不得不滾動瀏覽您的整個目錄，並且可能會感到沮喪。 因此，使用這些塊之一對於改善您的在線商店的用戶體驗至關重要。
#WooCommerce #product 過濾器塊🌪️🧱它們是什麼以及如何使用它們
幸運的是，使用 WooCommerce 產品過濾器塊也很容易。 您只需向您的產品添加分類法，例如類別、屬性或標籤。 然後，您可以在商店頁面上的所有產品塊旁邊使用相應的 WooCommerce 塊。
為了獲得更大的靈活性，您還可以安裝專用的 WooCommerce 產品過濾器插件。
😎 如果您想找到更多方法來創建更好的 WooCommerce 商店，您也可以查看 我們收集的必備 WooCommerce 插件.
您對使用 WooCommerce 產品過濾器塊有任何疑問嗎？ 在下面的評論部分讓我們知道！