如何使用 WooCommerce 塊自定義您的在線商店
已發表: 2020-05-08
最後更新 - 2020 年 5 月 20 日
WordPress 的最佳因素之一是它能夠為任何技能水平的用戶提供易於使用的界面; 技術人員和非技術人員。 現在,使用Gutenberg Block Editor ,WordPress 變得更加用戶友好和易於訪問,可以通過“拖放”內容塊(也稱為 WooCommerce 塊)來創建頁面。 使用這些塊,您不必編寫短代碼或編輯現有代碼行來實現某種格式或在您的頁面上查看。 使用 WooCommerce Blocks,您只需單擊幾下即可選擇和顯示產品、類別、過濾器等。
整個編輯體驗變得靈活。 這些內容塊是提供引人入勝的內容的絕佳工具,您可以在其中添加塊,並且在這些塊中,有更多選項可以添加多媒體、靜態圖像、文本等。
更多關於 WooCommerce 塊
打開編輯器時,您可以將塊放置在任何地方。 只需將光標移至頁面上您要編輯的位置,然後單擊左上角的“+”符號。 單擊加號後,將打開一個菜單,顯示所有可用塊。
快捷鍵:要快速將塊添加到內容中,請使用“/”鍵盤快捷鍵。 這將向您顯示可用的 WooCommerce 塊。 選擇塊後,您可以單擊它,它將被添加到您的頁面中,該頁面將為您顯示該特定塊的更多選項。
產品塊
顧名思義,產品塊允許您在頁面內顯示產品並發佈內容。 使用此塊,您甚至可以在博客文章中鏈接您的產品、創建自定義頁面並在登錄頁面上顯示您的最新產品。
特色產品塊
您可以在此塊中突出顯示單個產品並且可以自定義。 您可以添加一個按鈕並顯示帶有產品標題的價格; 鼓勵購買的所有必要信息。 登陸頁面上的這些特色產品塊是吸引用戶注意力並吸引他們購買的好方法。 您也可以將其作為視覺產品鏈接直接合併到您的博客文章中。
此外,疊加層也有很多設置,包括圖像焦點、背景不透明度、疊加層顏色和背景定位。
所有產品塊
此頁面是顯示您的所有項目/產品的地方。 當您想要添加文本、圖像、視頻等其他內容時,所有產品塊非常有用。 因此,不僅您的產品在展示時提供了良好的視覺效果,而且包含有關產品的重要細節,您的頁面變成了一個在線目錄——這就是它的初衷。
所有產品塊包括兩個重要的東西
- 佈局設置
- 內容設置
佈局設置:
- 設置頁面中的列數和行數並自定義產品網格佈局。
- 按鈕對齊 - 將它們設置在內容下方或對齊它們。
內容設置:
- 通過基於價格、評級、銷售或最新的產品的默認訂單訂購產品。
- 編輯為產品顯示的信息,包括 - 添加銷售徽章,包括描述、刪除評論和評論等。
- 顯示排序下拉菜單。
過濾器塊
在任何產品頁面中都應該在過濾器的幫助下具有出色的搜索功能。 否則,當他們不得不在眾多顯示的商品中手動搜索正確的商品時,您可能會失去您的客戶。 這不僅會使他們花費時間,而且對他們認為您的品牌達標也毫無用處。

因此,這些過濾器塊與所有產品塊結合使用時,可以讓網站訪問者進行有效和精確的產品搜索。 每當用戶選擇過濾器時,產品都會根據用戶設置的標准進行更新。
WooCommerce 塊中提供了三個過濾器塊。
- 按價格過濾; 最小值和最大值
- 按屬性過濾; 顏色、尺寸等
- 在側面顯示選定的過濾器
精選產品塊
這個特定的塊允許您手動選擇要顯示的項目。 讓我們假設您要寫一篇博客文章,並且它遵循某個主題,例如萬聖節服裝。 您可以做的是直接在您的博客文章中展示最適合萬聖節服裝創意的特定產品。 添加塊後,您可以選擇從產品列表中選擇或手動搜索您想要的確切產品。
精選產品塊的選項包括:
- 列數; 您最多可以選擇六個
- 對齊按鈕; 將它們設置在內容下方或對齊它們
- 顯示或隱藏產品標題、產品評級、價格和添加到購物車按鈕
審查塊
當您與商業企業打交道時,評論很重要,因為評論表明產品的真實性,其他潛在買家比產品聲稱更信任這些評論。 因此,請確保為每個產品提供此塊,以增加他們對您的網站和您必須提供的產品的信任。
同樣,您可以在任何地方顯示此博客; 在主頁、登錄頁面或專門用於推薦和評論的單獨頁面中。
審查塊選項包括:
- 顯示或隱藏產品標題或評分、評論者姓名、評論日期、評論內容和圖像(產品或評論者的)
- 您可以允許用戶按最高評分、最低評分和最新項目排序
- 設置要顯示的評論的起始數量
- 為用戶提供“加載更多”評論的選項
按產品和類別塊的評論
它們的功能與“所有評論塊”相同,但為您提供了額外的產品或類別來選擇和縮小評論範圍,只供您選擇。 這可以幫助您在自己的博客文章中推廣某個類別並希望包含其產品評論列表。
加起來
使用 WooCommerce Blocks,您可以將您的內容營銷提升到另一個層次,最好的部分是,您不需要專家為您做這件事。 有了這些塊,任何人都可以使用 WordPress 來發揮自己的優勢; 添加媒體、內容、自定義頁面和博客文章。
借助這些模塊,您的在線商店將獲得靈活且易於更改的設計和佈局。 如果您正在尋求專業幫助,請找一些專業的 WooCommerce 開發人員和設計師來幫助您。 此外,您還可以聯繫休斯頓的這家定制軟件開發公司,讓您的在線商店成為非凡的店面。
進一步閱讀
- WooCommerce 產品顯示插件。
- 如何為產品頁面帶來流量?