簡介
為了增加SEO效果與使用者體驗(讓訪客知道目前位於哪一頁),在設計網頁時常會在每一篇上方適當位置中加入「麵包屑(Breadcrumbs)」。
一般都是靠佈景主題內建的麵包屑(Breadcrumbs) 或 SEO外掛 或 麵包屑(Breadcrumbs)外掛來達成。
最常見的作法是靠SEO外掛就帶有麵包屑(Breadcrumbs)功能,但有些SEO外掛並不內建此功能(或是買Pro版才有),但也沒關係,我們可以利用Elementor Pro的模版功能來自製且更彈性,且不需再安裝任何外掛。
運用範圍
任何網站類型的每一篇文章、每一頁面、甚至每一商品都適用。
範例
用Elementor Pro做出以下範例的麵包屑(Breadcrumbs) :
- 首頁
- > 【Elementor】實戰情境題(含語法)
- > 如何只靠Elementor而不靠其它外掛來自製麵包屑(Breadcrumbs)以強化SEO效用?
這可不是寫死的文字,而是網頁載入時會自動根據這一頁的分類位置而自動出現相對應的分類與位置路徑。
原理與思路
用Elementor Pro的動態欄位對應來達成製作麵包屑(Breadcrumbs)的目的,所以我們一般會在「單篇文章」或「單篇頁面」或「單篇商品」的模版製作時,使用三組標題或文本或圖示列表來指定動態對應。
而範例中的「>」也是我們手動加的,它就不需要動態對應,僅是一個寫死的符號,你也可以改換成別的符號。
這麵包屑(Breadcrumbs)組好後,可以直接做在單頁模版中或另存成版型反覆插入套用喔。
實作
待補上。
影片
待補上。
總結
一般在「首頁」或「一頁式網頁」時可不用置入麵包屑(Breadcrumbs),比較不會破壞頁面設計的版型。
剩下的任何一頁可以考慮都置入麵包屑(Breadcrumbs),以強化SEO效果與使用者體驗。
麵包屑(Breadcrumbs)可以靠外掛來達成,但我覺真的覺得可以少裝一個外掛就盡量少裝一個,對整體維護與效能上有較大的助益。