為 WooCommerce 添加麵包屑的步驟
更新日期: 2024 年 3 月 7 日,撰稿人: 編輯團隊 | 審核人: Syed Balkhi
編輯注意: WPressize Me 的一些文章包含合作夥伴鏈接。這些鏈接的擁護不會影響我們編輯的意見或評價。了解有關我們編輯流程的更多信息。
為什麼要在 WooCommerce 中添加麵包屑?
麵包屑是顯示在產品頁或博客文章頂部的導航鏈接,這些鏈接向訪客展示了他們如何到達當前查看的頁面。例如,如果您的 WooCommerce 商店銷售服裝,那麼麵包屑菜單可能類似於“首頁 » 男裝 » 襯衫和 Polo 衫 » 正式襯衫”。
在 WooCommerce 中啟用麵包屑可以讓您的客戶更輕鬆地導航您的網上商店,並快速找到他們需要的產品。此外,麵包屑也有助於搜索引擎理解链接在您電子商務網站上的層次結構。搜索引擎如 Google 甚至會在搜索結果中顯示它們,這可能提高點擊率。
方法一:使用 AIOSEO 在 WooCommerce 中添加麵包屑(推薦)
啟用 WooCommerce 麵包屑的最簡單方法是使用 All in One SEO (AIOSEO) 插件。這是市場上最好的 WordPress SEO 插件,可以讓您只需點擊一下就能為 WooCommerce 添加麵包屑。該插件還可以幫助您在不需要任何技術技能的情況下優化網站以符合搜索引擎的要求。
首先,您需要在網站上安裝並激活 AIOSEO 插件。可以參考我們的指南以了解如何安裝 WordPress 插件。激活后,需導航到「All in One SEO » General Settings」並輸入許可證密鑰,您可以在 AIOSEO 帳戶區域找到密鑰。
接下來,使用其設置嚮導在您的 WooCommerce 商店上設置 AIOSEO。如果需要幫助,可以參考我們的指南了解如何設置 All in One SEO for WordPress。正確配置插件后,導航到「All in One SEO » General Settings」頁面,然後點擊「Breadcrumbs」選項卡。
啟用「Enable Breadcrumbs」選項,AIOSEO 會自動將麵包屑結構化數據標記添加到您的 WooCommerce 商店的代碼中。接下來,需選擇顯示麵包屑的方式。您可以使用短代碼或區塊手動添加它們到任何頁面或文章中,或添加到小工具區域。進階用戶甚至可以使用 PHP 代碼將麵包屑添加到主題模板文件中。
要自定義麵包屑,滾動到「麵包屑設置」部分,這裡有多個設置讓您自定義麵包屑。例如,您可以更改分隔符號、啟用首頁鏈接、添加麵包屑前綴、更改格式等。您甚至可以預覽導航鏈接在 WooCommerce 商店中的顯示效果。
AIOSEO Pro 還包括麵包屑模板,這些模板可讓您在不同內容類型、分類法和歸檔上展示專業的麵包屑鏈接。不僅如此,插件還提供不同的選項來自定義模板,例如,能禁用默認模板並查看更多設置選項。
完成自定義後,別忘了保存更改。接下來,您需要為 WooCommerce 產品頁面添加麵包屑。AIOSEO 會顯示四種不同的方法,最簡單的方法是使用短代碼在您的線上商店顯示麵包屑導航鏈接。只需在想要顯示麵包屑的地方添加以下短代碼即可:
前往「產品 » 所有產品」並編輯產品頁面,然後在 WordPress 編輯器的「文本」視圖中添加短代碼並更新頁面。現在,您可以訪問產品頁面查看麵包屑導航鏈接的效果。
此外,您也可以將麵包屑添加到 WooCommerce 商店的側欄。這樣,您不必編輯每個單獨的產品頁面來顯示導航鏈接,因為它們會在整個網站的側欄中顯示。要在側欄顯示麵包屑,可以從 WordPress 管理界面的「外觀 » 小工具」導航到小工具頁面。點擊左上角的加號圖標,搜尋「麵包屑」找到「AIOSEO – Breadcrumbs」小工具,將其拖拽到側欄並保存。然後,訪問您的 WooCommerce 商店查看側欄中的麵包屑。
方法二:使用 WooCommerce Breadcrumbs 插件添加麵包屑
另一種啟用 WooCommerce 麵包屑的方法是使用 WooCommerce Breadcrumbs 插件。這是一個免費的 WordPress 插件,可以讓您為線上商店添加麵包屑,但其自定義功能比 AIOSEO 要少得多。首先,您需要安裝並激活 WooCommerce Breadcrumbs 插件。激活后,前往「設置 » WC Breadcrumbs」頁面,勾選「啟用麵包屑」。
接下來,您可以更改 WooCommerce 商店中導航鏈接的外觀。WooCommerce 插件允許您選擇麵包屑分隔符號和麵包屑前後的 HTML 標籤。滾動頁面,您會找到更多自定義選項,比如更改導航鏈接中顯示的首頁文本和 URL。完成修改后,不要忘記保存更改。
專家指南:WordPress 和 WooCommerce 導航
- 麵包屑術語表
- 如何在 WordPress 中顯示麵包屑導航鏈接
- 如何創建智能 WooCommerce 產品搜索
- 如何在 WordPress 中添加箭頭鍵導航
- 如何在 WordPress 中添加導航菜單(初學者指南)
- 如何在 WordPress 主題中添加自定義導航菜單
- 如何將自定義項目添加到特定的 WordPress 菜單
- 如何在 WordPress 中創建下拉菜單(初學者指南)
- 如何向登錄用戶顯示不同的菜單
- 如何設置 WordPress 導航菜單樣式
希望本文章能幫助您了解如何在 WooCommerce 中添加麵包屑。您或許還想參閱我們的指南了解建站費用,或是看看我們專家挑選的最佳托管服務。如果您喜歡這篇文章,請訂閱我們的 YouTube 頻道以獲取更多 WordPress 教程視頻,也可以在 Twitter 和 Facebook 上找到我們。