如何使用WooCommerce的12個小工具（Widgets）

WooCommerce小工具可以讓你在WordPress企業網站架設時，添加不同產品功能到頁面上，譬如展示最新產品、產品分類、搜索產品、產品價格篩選等等。

如下圖所示，這些小工具位於WordPress後台的外觀》小工具頁面中，你可以將它們添加到網站主題設定的區域中。下圖中右側的主側邊欄、頁面小工具區域1等便是區域，網站主題是指你安裝並啟用的WordPress主題，不同主題提供的區域有所不同，並且不同主題的小工具設計樣式也不同。

如何添加WooCommerce小工具到頁面中

在WordPress後台的外觀》小工具頁面中，找到產品相關的小工具，如下圖所示，點擊小工具的右側三角箭頭，在下拉選項中找到你想要添加它們的區網域稱，選中區域後，點擊添加，即可將這個小工具添加到對應的區域中。一般我們用的比較多的區域是：Woocommerce側邊欄和產品側邊欄。

然後，通常在網站主題的設置中，如果你需要為頁面添加側邊欄，以Astra主題為例，你想在產品分類和產品頁面添加側邊欄，請查看教學：《Astra主題教學：免費架設企業網站》。

如果你使用Elementor Pro製作產品列表頁模板，可以使用Elementor的sidebar元素來將小工具所在區域加入到頁面中。

WooCommerce小工具介紹

啟用的產品過濾器

顯示已啟用的產品過濾器的列表，如下圖所示，我在產品列表中添加了兩個產品過濾器，分別是按價格篩选和按顏色篩選，當你調整篩選內容時，在啟用過濾器一欄中，會展示你選擇的篩選項。

購物車

當客戶把商品加入購物車時，在這個小工具裡會展示購物車內容與結賬按鈕。

按屬性篩選產品

當你給產品設置了屬性時，譬如顏色、尺碼等等，這個小工具能讓客戶按照屬性進行篩選，譬如篩選出藍色的產品。

下圖是這個小工具的配置項，你可以設置標題，選擇進行篩選的屬性，屬性值展示的形式（列表和下拉），還能設置查詢類型，即：當客戶選中多個屬性值時，屬性值之間是和的關係，還是或的關係，譬如：紅和黑，還是紅或黑。如果選擇“和”，表示既要是紅的，也要是黑的；如果選擇“或”，表示紅的、或黑的、或者紅黑的都可以。

按價格篩選產品

按評分篩選產品

根據商品的客戶評分來篩選，當商品沒有評分時，就不會展示。

產品類別

不同主題的產品類別樣式會有所區別，譬如下圖是Astra主題的產品類別樣式，父子分類是展開的，但有些主題是伸縮式的。

如下圖所示，你也可以在產品類別小工具中配置分類的排序、顯示分類下的產品數量、體現層級關係、隱藏無產品的空的分類等。

譬如下圖中，我隱藏了空分類、顯示了產品數量。

如果你想使用伸縮式的產品分類，而主題又不提供這種效果的話，你可以查看這篇教學：WordPress如何製作產品分類伸縮菜單。

產品

按照你設置的條件（譬如數量、順序）展示產品，譬如展示最新產品、推薦產品等等。

下圖是這個小工具的配置項，其中woocommerce自帶翻譯有點不准確，訂單其實是排序的意思（Order）。

好評產品

官方翻譯叫做產品按評級，其實就是按照評價從高到低選取前幾名的產品。

小工具效果如下

產品搜索

這是一個產品搜索框工具，如下所示

產品標籤雲

你可以在編輯產品時，給產品打標籤，每個產品可以有多個標籤

在產品列表頁添加產品標籤小工具後，如下圖所示，可以讓用戶快速的找出具有相同標籤的產品。

最新產品評價

展示你的商品收到的最新的評價，你可以控制顯示的評價數量。

最近瀏覽過的產品

展示瀏覽者最近看的產品，所以展示內容是因人而異的。