Hexo-NexT 網頁頁底配置

前言

網站現在基本的都有了,接下來就是來新增一些酷酷的東西了,這篇要講的是頁底,總共會分成底下這幾個部分

  1. 版權說明、icon、Powered by…
  2. 字數統計、估計閱讀時間
  3. 閱覽人數

完成後你的頁底就會變成像這樣嘍 完成後的頁底

版權說明、icon、Powered by…

首先先移駕到你的 theme 裡面主題的_config.yml 我的主題名稱是叫做NexT所以就是這裡,如果你的主題名稱你叫做其他名字就一樣點到那裡面的_config.yml,

然後找到 footer 的位置,應該會看到 since、icon、copyright、powered、beian 這些標題,接下來我會一一進行說明(beian 是所謂的 ICP 備案,是中國對非營利網站的一些規定,詳見這邊,不會影響中國大陸以外地區的網站,所以我就沒有用了,如果要用的話就單純是把你的資訊個別填到裡面去就會出現) 我只是想讓你們看得更清楚,才不是想曬我的三玖

  1. since:你這個網站開始的時間,在你的頁底就會是 XXXX~XXXX,但如果你寫的就是今年他就只會顯示今年的年份,也可以不打,那就是會顯示今年
  2. icon:這個就是在底下會看到的可愛圖示,預設是愛心,也可以再改成想要的圖案,如果想要改成自己想要的可以到這個網站找找看,然後把另外 animated 就是他會不會在那裡” 跳”!?(自己試試看就知道了),最後一個就顏色,可以自己去查色碼填到裡面去 像是我是用這個爪子,就把我框起來那個地方複製到name後面(但有些圖案顯示不出來,可以試試看其他樣式的,但如果都不行就只能換一個了,如果有大佬知道怎麼用的話歡迎在底下留言~)
  3. copyright:這個就是他為在圖示後面看要不要出現你的名字(名字的設定可以到最外層資料夾的_config 去改喔)
  4. powered:這裡如果打 true 就會出現由 Powered by Hexo & NexT 的字樣,留空就是不會出現

字數統計、估計閱讀時間

我們要使用的是這個插件,首先下載

1
npm install hexo-word-counter

接著在 NexT 內的_config 隨便找個地方貼上這些

1
2
3
4
symbols_count_time:
separated_meta: true # 在文章顯示時要不要分行
item_text_post: true # 在文章要不要用文字說明(但我設true跟false都一樣有文字)
item_text_total: true # 在頁底要不要有文字說明

接著再到最外層資料夾的_config 隨便找個地方貼上這些

1
2
3
4
5
6
7
8
9
symbols_count_time:
symbols: true # 在文章顯示總共有多少字
time: true # 在文章顯示總共需多少時間
total_symbols: true # 在頁底顯示總共有多少字
total_time: true # 在頁底顯示總共需多少時間
exclude_codeblock: true # 是否排除程式碼字數
awl: 2 #平均文字長度,中文為 2, 英文為 5, 預設為 4
wpm: 275 # 可以閱讀多少字每分鐘
suffix: "mins." # 時間的後綴

閱覽人數

搜尋 busuanzi_count,然後把 enabletrue 就完成了(如果有安裝 live2d 的會有問題,請到這邊來看解決辦法) 三玖真棒

結語

現在你的頁底是不是變得更好看了呢?如果有問題或者發現我有哪裡講錯,歡迎大家到底下留言區跟我討論喔~

其他功能

  1. 側邊欄

    基礎配置 (關於、標籤、分類、歸檔、搜尋、頭像、個人相關連結)
    切換語言

  2. 頁底 ✅

  3. utterances 留言板

  4. Google Analytics 統計網站資訊

  5. 日 / 夜模式

  6. live2d 角色(就是網頁右下角那隻可愛的狗狗)

  7. SEO:搜尋引擎最佳化 (Search Engine Optimization)

  8. 剩下的一些小工具

  9. 自訂網域