如何創建 Woocommerce 產品表

已發表: 2018-03-28

毫無疑問,Woocommerce 是最流行的 WordPress 電子商務解決方案。 但就像任何其他軟件一樣,它也有一些缺點。 一個是產品的展示選項,或者缺乏展示選項。 默認顯示是特色圖像的網格佈局,這對於某些類型的產品非常有用。 但在某些情況下,您的產品的表格佈局更加用戶友好。

這些類型的情況可能包括批發商店、產品目錄、訂單,甚至餐廳訂單。

如果您有這種商店,並且想在桌子上展示您的產品,那麼您很幸運。 Barn2Media 開發了一個名為 Woocommerce Product Table 的插件,該插件在可搜索和可排序的表格視圖中列出您的產品,並且使用起來非常簡單。

如何使用插件

首先,建議使用內置 Woocommerce 支持的 WordPress 主題。 這可確保您的網站在所有電子商務頁面上都有漂亮的樣式。 如果您使用一個好的多用途 WordPress 主題,您應該沒有任何問題。

使用這個插件是一件輕而易舉的事。 Barn2Media 的開發人員完成了一項了不起的工作,提供了適量的選項,而不會使創建產品表變得過於復雜。

以下是創建 Woocommerce 產品表並將其添加到您的網站所需執行的步驟:

步驟 1. 設置表格設計

您需要做的第一件事是獲取 Woocommerce 產品表插件。

安裝並激活插件後,您需要為產品表配置默認樣式。 這是將用於您創建的所有表格的樣式。 但是,您可以通過簡碼選項覆蓋這些設置。

要設置默認樣式,請導航到Woocommerce → 設置並選擇產品選項卡。 然後單擊產品表

表格樣式下,您有兩個選項:默認和自定義。

如果您選擇Default ,您的產品表格將使用 WordPress 主題中的表格樣式。

如果您選擇Custom ,將會出現一部分樣式選項,允許您為邊框、背景顏色和字體設置自己的自定義樣式。

步驟 2. 設置默認選項

在 Table Design 部分的正下方,您會找到Default Options 。 這些設置用於為您的產品表配置各種選項,例如列數、過濾器下拉列表、每頁行數等。就像樣式一樣,這些設置可以用單個短代碼中的參數覆蓋,稍後您將看到。

總的來說,這裡有 23 個選項,但您可以通過簡碼參數設置更多選項。 您可以在 Barn2Media 知識庫中找到完整的短代碼選項列表。 頁面上其他選項上方的列表右側還有一個方便的鏈接。

真正突出的一項功能是啟用延遲加載的能力。 當在一頁上顯示大量產品時,這有助於加快頁面加載時間。 但是,請記住,延遲加載確實會限制產品變體的搜索、排序和顯示。

第 3 步。將 Woocommerce 產品表添加到您的網站

現在您已經為您的產品表配置了所有默認樣式和設置,是時候向您的網站添加一個了。 如果您已經創建了要在其上插入產品表的頁面,請導航到該頁面的編輯屏幕。 如果沒有,請繼續創建一個新頁面。

在頁面的內容編輯器中,添加以下短代碼:

 [product_table]

然後發布或更新您的頁面。 就是這麼簡單。

簡碼將根據您在步驟 2 中配置的設置呈現產品表。但如前所述,您可以向簡碼添加參數以覆蓋這些設置或添加其他選項。

具有自定義圖像大小的簡碼

Woocommerce 產品表的默認圖像大小為 70×70,但假設您希望在頁面上使用較小的圖像有一個不同的產品表,以便佔用更少的垂直空間。 您只需像這樣使用圖像大小參數:

 [product_table image_size="40"]

帶有自定義類別的簡碼

默認情況下,從簡碼生成的任何產品表都將列出所有類別的所有產品。 但在某些情況下,您可能只需要顯示特定類別的產品。 例如,您想在服裝店網站上創建一個專門用於 T 恤的頁面。 你可以這樣做:

 [product_table category="t-shirts"]

您還可以在同一個簡碼中使用多個參數:

 [product_table image_size="40" category="t-shirts"]

您可以在 Barn2Media 知識庫中找到產品表選項的完整列表。

第 4 步。添加 Woocommerce 產品表小部件

如果您使用 Woocommerce,您可能已經熟悉包含的小部件。 Woocommerce 產品錶帶有四個自己的小部件,用於廣告類似的功能。 您可以將這些小部件添加到使用產品表短代碼的頁面。 為此,請導航至外觀 → 小部件並將它們拖動到位。 然後按照您想要的方式配置它們。

這些小部件包括:

  • 產品表:活動產品過濾器- 顯示活動過濾器,以便客戶可以看到哪些過濾器已經到位。 包括將表格還原為原始產品列表的選項。
  • 產品表:按屬性過濾產品– 通過選擇一個或多個屬性來過濾表中的產品。
  • 產品表:按價格篩選產品- 添加價格範圍滑塊。 客戶可以拖動它來設置預算並查看價格範圍內的產品。
  • 產品表:按評級過濾產品- 優化產品表以根據星級顯示產品。

結論與定價

雖然還有其他一些產品表插件可用,但它們在功能和易用性方面都無法與 Woocommerce 產品表提供的功能相提並論。 對我來說,這證明了這個插件只是 Premium 的事實。

以下是定價的細分:

  • 個人(1 個站點) $75
  • 商業(5 個站點)$135
  • 代理(20 個站點) $275

它可以增加您的轉化率這一事實使其物有所值。 如果它只幫助您銷售兩到三種額外的產品,那麼它已經收回了成本。 因此,總而言之,如果您發現自己需要以表格格式展示您的產品,則無需進一步查看。 這個插件是你需要的。

亨利·瓊斯

Henry Jones 是 ThemeTrust 的創始人和所有者。 自 2007 年以來,他一直在為 WordPress 設計和開發。