如何使用活動產品過濾器 WooCommerce 塊

最多 現代網上商店 使您能夠使用過濾器查找特定類型的產品。 活動產品過濾器 WooCommerce 塊通過幫助您檢查和查看您有哪些產品過濾器,使該過程更容易。

在本文中,我們將向您展示 Active Product Filters 塊的工作原理以及如何放置它。 我們將討論如何配置過濾器,並討論一些有效使用它的提示和技巧。

讓我們開始吧!

如何將活動產品過濾器 WooCommerce 塊添加到您的帖子或頁面

在我們討論 Active Product Filters 塊之前,我們需要討論 WooCommerce 提供的其他過濾元素。 當您將 Active Product Filters 元素添加到頁面或帖子時,它會顯示您通過其他塊選擇的過濾器。 此塊使您能夠禁用特定過濾器以擴大搜索範圍,但它不提供添加新過濾器的選項。

要放置此元素,請打開 WordPress 編輯器 並選擇添加新塊的選項。 使用搜索功能查找活動產品過濾器:

how-to-use-the-active-product-filters-woocommerce-block 如何使用活動產品過濾器 WooCommerce Block

由於您尚未指定任何過濾器,Active Product Filters 塊將在編輯器中顯示兩個佔位符選項。 這是放置塊後的樣子:

how-to-use-the-active-product-filters-woocommerce-block-1 如何使用有源產品過濾器 WooCommerce Block

該塊按屬性分隔過濾器。 您可以刪除特定的活動過濾器以擴大產品搜索範圍,或使用「全部清除」按鈕取消所有選項。

要添加新的選擇器,您需要使用其他與過濾器相關的選擇器之一 WooCommerce 塊. 塊編輯器提供三個這樣的選項:按價格過濾產品、按屬性過濾產品和按庫存過濾產品。

例如,如果您將按屬性過濾產品 WooCommerce 塊與活動產品過濾器元素配對,則如下所示:

how-to-use-the-active-product-filters-woocommerce-block-2 如何使用有源產品過濾器 WooCommerce Block

您可以將 Active Product Filters 塊與您想要的任何其他 WooCommerce 過濾元素配對。 儘管在您使用塊編輯器時它會顯示過濾器佔位符,但這些選項不會對訪問者顯示。 相反,他們只會看到他們使用其他塊之一選擇的過濾器。

活動產品過濾器 WooCommerce 阻止設置和選項

Active Product Filters 塊不提供廣泛的配置選項。 如果您將滑鼠懸停在編輯器中的塊上以訪問其格式設置菜單,您將只會看到重新排列其位置或將其轉換為不同類型元素的選項:

how-to-use-the-active-product-filters-woocommerce-block-3 如何使用有源產品過濾器 WooCommerce Block

要訪問塊的樣式設置,請選擇它並單擊屏幕右上角的齒輪圖標。 這將打開塊右側的菜單。 此菜單包括用於更改塊顯示活動過濾器的樣式以及修改活動過濾器文本的標題級別的選項:

how-to-use-the-active-product-filters-woocommerce-block-4 如何使用有源產品過濾器 WooCommerce Block

默認情況下,活動產品過濾器塊使用列表樣式來顯示活動過濾器。 如果您將樣式切換為「Chips」,則塊的外觀如下所示:

how-to-use-the-active-product-filters-woocommerce-block-5 如何使用有源產品過濾器 WooCommerce Block

除了這些選項之外,塊的設置菜單還提供了添加 CSS 類的選項。 你可以使用這些類 添加自定義 CSS 並進一步修改塊的樣式。

有效使用有源產品過濾器塊的提示和技巧

重要的是要重申,如果不添加 WooCommerce 提供的其他過濾元素之一,就不能使用 Active Product Filters 塊。 顧名思義,此塊使用戶能夠管理活動過濾器。 但是,它不允許用戶添加或選擇過濾器。

為此,您需要使用以下三個塊之一:按價格過濾產品、按屬性過濾產品或按庫存過濾產品。

您可以添加一個或多個這些塊,並將其與 Active Product Filters 元素配對。 但是,添加這些塊的最合乎邏輯的位置是在 您的商店頁面.

還值得注意的是,在您選擇至少一個過濾器之前,Active Product Filters 塊不會顯示在您網站的前端:

how-to-use-the-active-product-filters-woocommerce-block 如何使用活動產品過濾器 WooCommerce Block

從可用性的角度來看,將 Active Product Filters 塊放在其他元素下方是有意義的。 這樣,一旦出現在頁面上,塊就不會向下推其他元素。

關於有源產品過濾器 WooCommerce 塊的常見問題

有源產品過濾器塊非常易於使用並可與其他元素配對。 但是,如果您對如何使用它仍有任何疑問,本節旨在回答這些問題。

我可以單獨使用 Active Product Filters 塊嗎?

您可以將 Active Product Filters 塊放置在您網站的任何位置。 但是,除非您為用戶提供一種選擇他們想要使用的過濾器的方法,否則該塊不會出現在您的頁面上。 為此,您需要使用按價格過濾產品、按屬性過濾產品或按庫存過濾產品塊。

為什麼活動產品過濾器塊沒有顯示在我的網站上?

只有當您選擇一個或多個過濾器時,才會出現 Active Product Filters 塊。 如果您沒有活動過濾器,則該塊將不會顯示在前端。 此外,如果您使用「全部清除」選項移除所有活動過濾器,該塊將隱藏自身。

我應該在哪裡放置有源產品過濾器塊?

將 Active Product Filters 塊放在商店的商店頁面上最有意義。 這樣,客戶將能夠使用您提供的任何選項過濾產品,並使用活動產品過濾器塊管理這些過濾器。

結論

產品過濾器使客戶能夠輕鬆瀏覽您商店的產品目錄。 越多 WooCommerce 屬性 您設置後,客戶就越容易使用過濾器找到他們正在尋找的產品。 通過使用 Active Product Filters WooCommerce 塊,您可以讓用戶更好地控制他們可以使用的過濾器。

請務必記住,活動產品過濾器塊僅在用戶選擇一個或多個過濾器後才會顯示。 為此,您需要使用以下塊之一:按價格過濾產品、按屬性過濾產品或按庫存過濾產品。

您對如何使用 Active Product Filters WooCommerce 塊有任何疑問嗎? 讓我們在下面的評論部分中討論它們!

精選圖片來自 GoodStudio/shutterstock.com

來源

相關文章