作者:,     

在 Blogger 頂端新增「導覽選單」,輕鬆依分類、主題來瀏覽文章

Blogger-logo

前一陣子聽說有一小波 PIXNET 逃難潮?其實國內部落格用戶也沒多少地方可以逃了,一堆 BSP 不是只維持基本運作、不再更新,不然就是自己塞了更多、更醜的廣告還不給作者放廣告,再加上大部分使用者不是沒有架站方面的技術,不然就是不想花太多時間、精力維持一個網站主機的運作…。很多人最後還是選擇原本不那麼被看好的 Blogger 部落格服務,或者乾脆整個搬到 Facebook 去(短期有不錯的優勢,長期嘛…)。

雖然 Google 的東西看起來穩定性高很多,客製化的彈性也很不錯(還能放自己的廣告),不過很多人還是用不太慣。光是版面配置的部分沒有大家很愛用的「分類選單」就有點奇怪。儘管內建了數十個佈景主題可以選,不過在網站 Header 的部分預設是沒有選單可以按的(就是放在網站上方的下拉選單),得自己在「版面配置」新增。

以下簡單介紹如何在 Blogger 的版面中增設網站的「導覽選單」,只要在網站頭部加上一些 HTML 控制碼就好,任何佈景主題都可以用,相當簡單。有需要的話,還可自行透過 CSS 來加工裝飾,呈現兩層或多層次的選單,或加上其他視覺特效。

 

會用到的 HTML 控制碼:(請改成你自己的網址與標題)

 

<ul id="mynavid">
<li><a href="/">【回首頁】</a></li>
<li><a href="https://briian.com/category/android">Android</a></li>
<li><a href="https://briian.com/category/ios">iPhone</a></li>
<li><a href="https://briian.com/category/pc">Windows</a></li>
<li><a href="https://briian.com/">重灌狂人</a></li>
<li><a href="https://briian.com/about-briian-com">關於我</a></li>
</ul>

在 Blogger 部落格新增導覽列、導覽選單的方法:

第1步  開啟並登入 Blogger 後台,進入你的部落格管理頁面,點一下「版面配置」,然後在「Cross-Column」點「新增小工具」。

Blogger-header-nav-01

 

第2步  在「新增小工具」視窗中找到「HTML/JavaScript」這項目並按右邊的「+」按鈕,將此功能新增到「Cross-Column」欄位中。

Blogger-header-nav-02

 

第3步  請在「內容」區塊中填入以下的控制碼,「標題」方框維持空白即可,設定好之後按下「儲存」。

HTML 控制碼:(請改成你自己的網址與標題)
 
<ul id="mynavid">
<li><a href="/">【回首頁】</a></li>
<li><a href="https://briian.com/category/android">Android</a></li>
<li><a href="https://briian.com/category/ios">iPhone</a></li>
<li><a href="https://briian.com/category/pc">Windows</a></li>
<li><a href="https://briian.com/">重灌狂人</a></li>
<li><a href="https://briian.com/about-briian-com">關於我</a></li>
</ul>

Blogger-header-nav-03

 

第4步  完成後,可先按「預覽」看看是否還需要修改什麼,確定沒問題的話再按「儲存排列方式」。

Blogger-header-nav-04

 

第5步  接著開啟你的 Blogger 部落格首頁,看看新的導覽選單是否可以正常使用。

Blogger-header-nav-05

 

非經授權,請勿全文轉載,本文網址:
→ 免費訂閱最新文章:  (如何訂閱?)
作者: | 發佈日期:
注意事項:本站所介紹之軟體、設定或網站服務,經實際安裝測試並通過防毒軟體掃毒。但因為不同電腦環境與軟體設定可能都各有差異,建議您僅在非工作用的電腦安裝、測試,避免因為不可預知的錯誤、當機或軟硬體衝突,影響您的工作或電腦運作。另外,在進行任何重要的操作與設定之前,記得先行備份電腦中的重要資料,避免因為未依指示的不當操作或其他疏失造成資料毀損。當您依照本文所提供之訊息執行各種操作,表示您已閱讀此注意事項並同意自行承擔可能之風險與責任。
相關文章...

 

歡迎留下你的想法或意見...

  1. Amy鄒 說道:

    版主您好!
    感謝您的詳細教學
    導覽選單設定好了,但如何將文章放在導覽選單內呢?
    百思不得其解
    感恩回覆

  2. 雨水 說道:

    谢谢,已经好了!关于文章分类,怎么做?你会吗?我查了下用可以用label 但是没有category !如何做category ?

  3. rukawatung 說道:

    正好需要這個設定,感謝分享!

發表迴響

你的電子郵件位址並不會被公開。