iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 16
0
自我挑戰組

架站好好玩-Wordpress架站和SEO優化之學習全記錄系列 第 16

第16天:『WordPress架站第十一步』-製作站內導航

  • 分享至 

  • xImage
  •  

WordPress架站-站內導航

洋片媽媽 設計。手作。育兒日常的網站,大致功能都已完成,不過在實際操作時,發現每次點選一個頁面,要切換到其他頁面時,針對多個子項目選單,來回切換時並不方便,參考一些知名網站大都在網站底部做一個站內導航的功能,也就是導覽選單,其實和Header上的選單是相同的東西,只是將所有頁面連結完整呈現在最下方,讓使用者在切換不同頁面時,可以更加直觀和快速。

  1. 點選外觀=>小工具
    https://ithelp.ithome.com.tw/upload/images/20201001/20130379oSchE19TAl.png

  2. 在可用的小工具中,選擇導覽選單,勾選「Footer Widget Area 1」,並點選新增小工具。由於要呈現的項目很多,所以重複運用相同方式,分別勾選「Footer Widget Area 2」, 「Footer Widget Area 3」和 「Footer Widget Area 4」再新增小工具
    https://ithelp.ithome.com.tw/upload/images/20201001/20130379GHaCUBNK4W.png

  3. 由於總共新增了四個小工具的區塊,所以必須有四個對應的選單,再到外觀=>選單
    https://ithelp.ithome.com.tw/upload/images/20201001/20130379ERT6WJETu7.png

  4. 建立選單
    https://ithelp.ithome.com.tw/upload/images/20201001/2013037927KMBR29Ao.png

  5. 填入選單名稱
    https://ithelp.ithome.com.tw/upload/images/20201001/201303799tqwUeidwB.png

  6. 建立選單可參考第11天:『WordPress架站第六步』-選單製作的方式,分別製作四個選單
    https://ithelp.ithome.com.tw/upload/images/20201001/20130379po1hFvlJnV.png

  7. 四個選單都設定完畢,再回到外觀=>小工具,Footer Widget Area 1中選取選單,選擇了Other並Save。而剛才新增的Footer Widget Area 2-4的小工具,也運用相同方法分別選取對應的選單
    https://ithelp.ithome.com.tw/upload/images/20201001/20130379E2N5Wgdhx7.png

  8. 最後站內導航會出現在網頁最下方
    https://ithelp.ithome.com.tw/upload/images/20201001/20130379txud6G81wR.png


上一篇
第15天:『WordPress架站第十步』-使用Jetpack外掛的訂閱功能
下一篇
第17天:學習SEO優化和實踐
系列文
架站好好玩-Wordpress架站和SEO優化之學習全記錄30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言