Intro NextT Customized function

Posted on Edited on In Views: Disqus: Symbols count in article: 2.2k Reading time ≈ 4 mins.

Intro NextT Customized function

這篇介紹NextT Customized function。

pjax

1
2
3
4
5
6
7
8
9
pjax 實現了 URL 改變但不重新整理整個頁面，也就是只有局部的頁面會更新，不會讓整個頁面重新閃動(重新整理)。

修改 /themes/next/_config.yml
# Easily enable fast Ajax navigation on your website.
# Dependencies: https://github.com/theme-next/theme-next-pjax
pjax: true

安裝lib
$ git clone https://github.com/theme-next/theme-next-pjax themes/next/source/lib/pjax

Symbols count & Reading time in article

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
修改 /themes/next/_config.yml
# Post wordcount display settings
# Dependencies: https://github.com/theme-next/hexo-symbols-count-time
symbols_count_time:
  separated_meta: true # 是否"換行顯示"字數統計及閱讀時長
  item_text_post: false # 字數統計和閱讀時長是要使用小圖示(true)還是文字表示(false)
  item_text_total: false # 文章底部的字數統計和閱讀時長是要使用小圖示(true)還是文字表示(false)

安裝lib
$ npm install hexo-symbols-count-time --save

修改 /root/_config.yml
symbols_count_time:
  symbols: true # 文章是否顯示字數統計
  time: true # 文章是否顯示閱讀時間
  total_symbols: true # 網頁底部是否顯示字數統計
  total_time: true # 網頁底部是否顯示閱讀時間
  exclude_codeblock: false # 排除程式碼字數統計
  awl: 2  #平均文字長度，中文為 2, 英文為 5, 預設為 4
  wpm: 275  #一分鐘閱讀字數，預設為 275
  suffix: "分鐘"
 
memo:加在檔案最下方即可

search in article

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
修改 /themes/next/_config.yml
local_search:
  enable: true

安裝lib
$ npm install hexo-generator-searchdb --save

修改 /root/_config.yml
search:
  path: search.xml
  field: post
  content: true
  format: html
 
memo:加在檔案最下方即可

processbar

1
2
3
4
5
6
7
8
9
修改 /themes/next/_config.yml
# Progress bar in the top during page loading.
# Dependencies: https://github.com/theme-next/theme-next-pace
# For more information: https://github.com/HubSpot/pace
pace:
  enable: true  #false 改成 true

安裝lib
$ git clone https://github.com/theme-next/theme-next-pace themes/next/source/lib/pace

sitemap.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
「Sitemap」是一種用來提供網站資訊的檔案，您可以在其中列出網頁、影片和其他檔案的資訊，
並呈現這些內容彼此間的關係。Google 等搜尋引擎都會讀取網站的 Sitemap 檔案，
藉此以更有效率的方式檢索網站。

安裝lib
$ npm install hexo-generator-sitemap --save

修改 /root/_config.yml
sitemap:
  path: sitemap.xml
  tags: false
  categories: false

memo:加在檔案最下方即可

加入背景圖片

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
修改 /themes/next/_config.yml
custom_file_path:
  style: source/_data/styles.styl
  
加入檔案/root/source/_data/styles.styl

styles.styl內容:
body {
      background:url(/images/background.jpg);
      background-size: cover;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-position:center center;
}

背景圖片需放/root/source/images/background.jpg