用Blogger的「網頁」清單建立「導覽列」

https://blogger-script-study.blogspot.com/2010/05/blogger-pages-create-browse-menu.html?m=0

現在起使用 Blogger 也可以輕鬆製作「導覽列」選單了。以前都只能下載別人製作好的範本或自己修改模板語法 (template Html)，否則很難製作出導覽列。

導覽列的好處可以讓網友在瀏覽我們的部落格時，快速連結到部落格內的特定網頁，比如說連結到「相簿」、「留言板」、「關於我」…等，我較常用的是連結到一些我已經針對某一主題寫過很多文章的整理文，這樣可以方便讀者找到一個有主題的導覽文，也增加了訪客的停留時間並降低網頁的跳出率。

很多人一開始看到這個「網頁」清單的新功能都搞不清楚是什麼，就算知道了也不會用，我也不例外，後來找了一些資料才知道如何使用。

1. 首先進入 Blogger 的後台的【版面配置】，隨便點選一個可以【新增小工具】的地方。

2. 開啟「新增小工具」視窗，點選【網頁】。

3. 會切換到「設定網頁清單」視窗。建議你把「標題(可省略)」】的地方變成空白。一開始只有一個「首頁」指到你的部落格的根部網址你，也可以變更其命名，比如說改成英文【Home】，先按【儲存】。

4. 回到【版面配置】畫面，如果你的「網頁」小工具不是出現在整頁的最上方，就用拖曳的方式把它拉到整頁的最上方。

5. 先按【儲存】，然後按【檢視網頁】，你會發現網頁標題的下方出現一個新的導覽列，也有一個新的導覽選項【首頁】，就是剛剛新增的那個，如果你剛剛把它改名為【Home】，它就會現出【Home】。

6. 接下來，我們來多增加一個新的導覽選項【關於我】。再進入Blogger後台 （不是編輯小工具喔！），點選【文章】→【編輯網頁】→【新網頁】。
  

7. 「網頁標題：」寫【關於我】，內容就自己寫囉！寫好之後按【發佈網頁】。

8. 點選【檢視網誌】會到部落格首頁，點選【檢視網頁】會到剛剛新增的「關於我」網頁。先點【檢視網誌】。

9. 【關於我】的導覽列選項已經加上來了。點選看看有什麼變化？可以試看看在【首頁】與【關於我】之間切換看看。請注意其網址沒有加上年月耶，也就是說直接放在部落格的根目錄，一般的部落格發表的文章都會再跟目錄底下在加上年月，自己觀察看看吧。其實如果剛剛編輯網頁的時候先用純英文的標題，如 【About Me】，那麼網址名稱就會是英文的 blog-root/about-me.html 喔參考這一篇主動操控Blogger的網頁檔名有意義化，提昇PageRank。

• 「首頁」在http://bloggerscriptstudy.blogspot.com/
• 「關於我」在http://bloggerscriptstudy.blogspot.com/p/blog-page.html
  

10. 至於導覽列選項的文字字型大小、顏色及背景，就要使用 Blogger 的新【測試區】功能，有機會再說明吧。

---

回到 Blogger 部落格技巧總整理