WooCommerce：如何開始使用 WooCommerce 塊 - 第 1 部分

自 WordPress 5.0 以來，默認頁面/帖子編輯器已完全重新開發。 當然，您聽說過古騰堡。

壞消息是 WooCommerce 加入新編輯體驗的速度要慢得多，為了使其對 Gutenberg 友好，還有很多重要的事情需要開發。

可以通過 WooCommerce Blocks 官方插件跟踪兼容性進度，該插件指出“如果您想訪問 WooCommerce 的所有可用塊 - 包括實驗性塊，您可以使用此插件。 我們當前的“穩定”塊被捆綁到 WooCommerce 中，並且可以從塊插入器中的“WooCommerce”部分添加，因為您可以在那裡找到他們的“測試版”塊，他們稱之為“實驗性”，這將是正式的一旦獲得批准，就會發佈到 WooCommerce。

在本文中，我們將專門深入探討 WooCommerce 塊——它們是什麼、為什麼它們很重要、有多少塊可用以及如何使用它們。

由於這是一個巨大的話題——我們有 20 個 WooCommerce 塊要涵蓋——我們將它分為兩部分。 本文將評估您可以在商店中使用的前十個 Block。 但首先，讓我們確定什麼是 WooCommerce 塊並調查它們為何如此重要。

什麼是 WooCommerce 塊，為什麼它們如此重要？

WooCommerce 會自動創建類別頁面和商店頁面等頁面來展示您的產品。 但是，另一個 WooCommerce 網站可能看起來與您的電子商務商店相似——如果他們選擇與您相同的頁面和產品佈局。

但是，使用 WooCommerce Blocks，您可以使您的商店獨一無二，並以您喜歡的方式和佈局展示您的產品。

WooCommerce Blocks 為您提供對商店設計的更多控制。 它與塊編輯器的集成允許您自定義您的商店，而無需編寫單行 CSS、添加代碼或需要圖形設計專業知識。

您可以使用簡單的拖放方法輕鬆添加塊。 使用 WooCommerce Block 易於使用的界面，您可以：

• 創建自定義商店頁面
• 創建登錄頁面以顯示產品集合
• 在特定頁面甚至博客文章中添加產品塊
• 隨時隨地添加產品推薦、產品評論和促銷橫幅

那麼，讓我們來看看不同的 WooCommerce 塊。 安裝 WooCommerce 後，您將獲得 20 個內置的 WooCommerce 塊。 下面介紹前十個塊以及如何使用它們。

基本 WooCommerce 塊列表 [第 1 部分]

1. 有源產品過濾器

產品過濾器有助於為您的客戶搜索產品。 沒有它們，就有失去客戶的風險——因為他們必須手動搜索他們選擇的產品。 不幸的是，這個過程會變得非常耗時，並且會使您的網站對目標受眾的有用性和互動性降低。

活動產品過濾器塊顯示當前視圖中當前處於活動狀態的產品過濾器（因此，在上一步中選擇的過濾器）。 此外，此塊將自動獲取您產品的屬性——允許您的客戶按任何屬性過濾有效產品。

您可以設置塊標題的樣式，並選擇將過濾器顯示為芯片（類似於按鈕）或列表。 因此，此模塊可以輕鬆添加產品尺寸、形狀或顏色等過濾器，從而為您的客戶帶來極大便利。

2. 所有評論

顯示客戶評論是展示產品可信度和真實性的絕佳方式。 它充當了買家比產品聲稱更信任的產品證明——增加了用戶購買產品的機會。

據 Trustpilot 稱，89% 的客戶在購買產品之前會閱讀在線評論。 這顯示了客戶評論在您的電子商務銷售中發揮的不可或缺的作用。

因此，在您的 WooCommerce 網站上包含所有評論塊可以改變您產品銷售的遊戲規則。

此塊將允許您顯示您在商店的任何位置收到的所有產品評論的完整列表 - 例如博客文章或登錄頁面。

它帶有許多自定義選項，您可以選擇隱藏或顯示產品名稱、評論者姓名、評論日期、產品評級、評論內容和產品圖像。

您可以通過允許用戶按最低評分或更高評分排序來自定義設置，甚至可以設置要顯示的評論數量並為您的客戶添加“加載更多評論”選項。

3. 所有產品

所有產品塊顯示您 WooCommerce 商店中的所有產品，並帶有排序和分頁選項。 您可以將此塊與 Active Product Filters 塊對齊以顯示排序下拉列表。

使用其內置的分頁選項，如果您不希望在單個頁面上顯示所有產品，您的客戶可以輕鬆地前後導航您的產品以查看整個產品頁面。

您可以選擇默認的產品排序順序——無論是按最新產品還是產品受歡迎程度進行排序。 如果需要，您還可以隱藏排序下拉菜單。 此外，此塊還允許您添加其他內容，例如圖像、文本和視頻。

4. 特色類別

特色類別塊允許您從特定產品類別中選擇您希望設置並顯示為特色類別或號召性用語橫幅的產品。

這是在您的登錄頁面或博客文章上突出顯示特定產品類別的完美解決方案 - 以增加流量並最大化該特定產品類別的銷售額。

它最重要的功能之一是焦點選擇器，它允許您拖動產品圖像的焦點以將其完美地放置在背景容器中。 此塊還為您提供隱藏或顯示產品描述、添加覆蓋顏色和更改不透明度等選項。

因此，如果您最近推出了一個新產品系列 - 特色類別塊可以幫助您在商店的多個地方展示該系列並推動銷售。

5. 特色產品

特色產品塊允許您在帶有號召性用語 (CTA) 的漂亮、有影響力和設計精美的橫幅中展示您的商店產品。

它帶有大量設置和選項來顯示或隱藏產品價格和描述、控製文本對齊、添加覆蓋顏色、調整背景定位和不透明度、覆蓋產品照片以及更改按鈕 CTA。

此塊是在您的博客文章或登錄頁面上展示特定產品並吸引客戶注意力的完美方式 - 吸引他們進行購買。

6. 產品分類

按類別劃分的產品塊允許您在網格中顯示來自選定類別的產品。

它允許您修改網格的行數和列數，並可選擇隱藏或顯示產品標題、價格、評級和添加到購物車按鈕。 此塊可以在您的主頁上創建具有不同產品類別的不同部分。

7. 暢銷產品

暢銷產品塊允許您在網格中顯示商店的暢銷產品。

此塊的設計與具有相同自定義選項的 Products By Category 塊的設計非常相似。 例如，您可以為產品設置適當的過濾器選項——例如按顏色、尺寸和價格過濾。

使用此塊 - 您可以鼓勵客戶瀏覽您最暢銷的產品並誘使他們為自己購買產品。

8. 按價格篩選產品

此塊顯示一個易於使用的滑塊，允許客戶按價格過濾產品。 例如，向右拖動左手柄會增加價格，而向左拖動右手柄會降低價格。

您可以編輯最低和最高價格範圍並添加一個按鈕來設置標題級別。 它與所有產品塊完美結合。

9. 按屬性過濾產品

此塊添加了一個過濾器，允許您的客戶按屬性過濾產品。 屬性可以是顏色、大小，甚至是食物風味。

您可以選擇將過濾器顯示為列表或下拉列表。 此外，您可以選擇標題級別、包含字數或添加按鈕。

10. 最新產品

您可以使用此塊在網格中顯示所有最新發布和最新產品。 客戶可以根據相關類別過濾產品。

這個區塊非常適合在主頁上展示和營銷您商店的新庫存並吸引更多的目光。 它的自定義選項類似於 Best Selling Products Block。

結論

無論您是精通技術還是非技術專業人士 - 使用 WooCommerce Blocks 都是以引人入勝的方式展示您的產品並將您的商店提升到新水平的最簡單和最具成本效益的方式。

您可以在您網站上的任何頁面和博客文章上宣傳您的產品。 您所要做的就是將塊拖到頁面上的特定位置 - 頁面實時更新。

因此，如果您希望讓您的 WooCommerce 商店煥然一新並吸引更多注意力，請使用上面提到的 WooCommerce 塊。

我們還有本文的第 2 部分，其中包含另外十個 WooCommerce 塊以及輕鬆添加和編輯它們的方法。 在下週上線時檢查一下！