NexT中文文檔摘錄

NexT 中文文檔⚡️

一、目錄

• 安裝 NexT
  • 下載下傳 NexT 主題
  • 啟用 NexT 主題
  • 驗證是否正确啟用
• 主題設定
  • 選擇「Scheme」
  • 設定「界面語言」
  • 設定「菜單」
  • 設定「側欄」
  • 設定「頭像」
  • 設定「作者昵稱」
  • 設定「站點描述」
• 內建第三方服務
  • 百度統計
  • 閱讀次數統計（LeanCloud）
  • Algolia 搜尋

二、正文

Hexo 是高效的靜态站點生成架構，她基于 Node.js。 通過 Hexo 你可以輕松地使用 Markdown 編寫文章，除了 Markdown 本身的文法之外，還可以使用 Hexo 提供的 标簽插件 來快速的插入特定形式的内容。在這篇文章中，假定你已經成功安裝了 Hexo，并使用 Hexo 提供的指令建立了一個站點。

你可以通路 Hexo 的文檔：https://hexo.io/zh-cn/docs/ 了解如何安裝 Hexo

在 Hexo 中有兩份主要的配置檔案，其名稱都是

_config.yml

。 其中，一份位于站點根目錄下，主要包含 Hexo 本身的配置；另一份位于主題目錄下，這份配置由主題作者提供，主要用于配置主題相關的選項。

為了描述友善，在以下說明中，将前者稱為

站點配置檔案

， 後者稱為

主題配置檔案

。

安裝 NexT

Hexo 安裝主題的方式非常簡單，隻需要将主題檔案拷貝至站點目錄的

themes

目錄下， 然後修改下配置檔案即可。具體到 NexT 來說，安裝步驟如下。

下載下傳主題

如果你熟悉 Git， 建議你使用 克隆最新版本 的方式，之後的更新可以通過

git pull

來快速更新， 而不用再次下載下傳壓縮包替換。

• 克隆最新版本

  在終端視窗下，定位到 Hexo 站點目錄下。使用

  Git

  checkout 代碼：

$ cd your-hexo-site
$ git clone https://github.com/iissnan/hexo-theme-next themes/next
           

• 下載下傳穩定版本

1. 前往 NexT 版本 釋出頁面。
2. 選擇你所需要的版本，下載下傳 Download 區域下的 Source Code (zip) 到本地。例如，下載下傳 v0.4.0 版本：

   

3. 解壓所下載下傳的壓縮包至站點的 themes 目錄下， 并将 解壓後的檔案夾名稱（

   hexo-theme-next-0.4.0

   ）更改為

   next

   。

如果你對 Git 感興趣，可以通過《Pro Git》這本書來學習。你可以通路我制作的一個線上版本（第一版）：http://iissnan.com/progit。

啟用主題

與所有 Hexo 主題啟用的模式一樣。 當 克隆/下載下傳 完成後，打開 站點配置檔案， 找到

theme

字段，并将其值更改為

next

。

啟用 NexT 主題

theme: next
           

到此，NexT 主題安裝完成。下一步我們将驗證主題是否正确啟用。在切換主題之後、驗證之前， 我們最好使用

hexo clean

來清除 Hexo 的緩存。

驗證主題

首先啟動 Hexo 本地站點，并開啟調試模式（即加上

--debug

），整個指令是

hexo s --debug

。 在服務啟動的過程，注意觀察指令行輸出是否有任何異常資訊，如果你碰到問題，這些資訊将幫助他人更好的定位錯誤。 當指令行輸出中提示出：

INFO  Hexo is running at http://0.0.0.0:4000/. Press Ctrl+C to stop.
           

此時即可使用浏覽器通路

http://localhost:4000

，檢查站點是否正确運作。

當你看到站點的外觀與下圖所示類似時即說明你已成功安裝 NexT 主題。這是 NexT 預設的 Scheme —— Muse

現在，你已經成功安裝并啟用了 NexT 主題。下一步我們将要更改一些主題的設定，包括個性化以及內建第三方服務。

主題設定

選擇 Scheme

Scheme 是 NexT 提供的一種特性，借助于 Scheme，NexT 為你提供多種不同的外觀。同時，幾乎所有的配置都可以 在 Scheme 之間共用。目前 NexT 支援三種 Scheme，他們是：

• Muse - 預設 Scheme，這是 NexT 最初的版本，黑白主調，大量留白
• Mist - Muse 的緊湊版本，整潔有序的單欄外觀
• Pisces - 雙欄 Scheme，小家碧玉似的清新

Scheme 的切換通過更改 主題配置檔案，搜尋 scheme 關鍵字。 你會看到有三行 scheme 的配置，将你需用啟用的 scheme 前面注釋

#

去除即可。

選擇 Pisces Scheme

#scheme: Muse
#scheme: Mist
scheme: Pisces
           

設定 語言

編輯 站點配置檔案， 将

language

設定成你所需要的語言。建議明确設定你所需要的語言，例如選用簡體中文，配置如下：

language: zh-Hans
           

目前 NexT 支援的語言如以下表格所示：

設定 菜單

菜單配置包括三個部分，第一是菜單項（名稱和連結），第二是菜單項的顯示文本，第三是菜單項對應的圖示。 NexT 使用的是 Font Awesome 提供的圖示， Font Awesome 提供了 600+ 的圖示，可以滿足絕大的多數的場景，同時無須擔心在 Retina 螢幕下 圖示模糊的問題。

編輯 主題配置檔案，修改以下内容：

1. 設定菜單内容，對應的字段是

   menu

   。 菜單内容的設定格式是：

   item name: link

   。其中

   item name

   是一個名稱，這個名稱并不直接顯示在頁面上，她将用于比對圖示以及翻譯。

   菜單示例配置

   menu:
     home: /
     archives: /archives
     #about: /about
     #categories: /categories
     tags: /tags
     #commonweal: /404.html
              

   若你的站點運作在子目錄中，請将連結字首的 `/` 去掉

   NexT 預設的菜單項有（标注 的項表示需要手動建立這個頁面）：

1. 設定菜單項的顯示文本。在第一步中設定的菜單的名稱并不直接用于界面上的展示。Hexo 在生成的時候将使用 這個名稱查找對應的語言翻譯，并提取顯示文本。這些翻譯文本放置在 NexT 主題目錄下的

   languages/{language}.yml

   （

   {language}

   為你所使用的語言）。

   以簡體中文為例，若你需要添加一個菜單項，比如

   something

   。那麼就需要修改簡體中文對應的翻譯檔案

   languages/zh-Hans.yml

   ，在

   menu

   字段下添加一項：

   menu:
     home: 首頁
     archives: 歸檔
     categories: 分類
     tags: 标簽
     about: 關于
     search: 搜尋
     commonweal: 公益404
     something: 有料
              

2. 設定菜單項的圖示，對應的字段是

   menu_icons

   。 此設定格式是

   item name: icon name

   ，其中

   item name

   與上一步所配置的菜單名字對應，

   icon name

   是 Font Awesome 圖示的 名字。而

   enable

   可用于控制是否顯示圖示，你可以設定成

   false

   來去掉圖示。

   菜單圖示配置示例

   menu_icons:
     enable: true
     # Icon Mapping.
     home: home
     about: user
     categories: th
     tags: tags
     archives: archive
     commonweal: heartbeat
              

   在菜單圖示開啟的情況下，如果菜單項與菜單未比對（沒有設定或者無效的 Font Awesome 圖示名字） 的情況下，NexT 将會使用 作為圖示。

   請注意鍵值（如 `home`）的大小寫要嚴格比對

設定 側欄

預設情況下，側欄僅在文章頁面（擁有目錄清單）時才顯示，并放置于右側位置。 可以通過修改 主題配置檔案 中的

sidebar

字段來控制側欄的行為。側欄的設定包括兩個部分，其一是側欄的位置， 其二是側欄顯示的時機。

1. 設定側欄的位置，修改

   sidebar.position

   的值，支援的選項有：
   • left - 靠左放置
   • right - 靠右放置

   目前僅 Pisces Scheme 支援 `position` 配置。影響版本5.0.0及更低版本。

   sidebar:
     position: left
              

2. 設定側欄顯示的時機，修改

   sidebar.display

   的值，支援的選項有：

   • post

     - 預設行為，在文章頁面（擁有目錄清單）時顯示

   • always

     - 在所有頁面中都顯示

   • hide

     - 在所有頁面中都隐藏（可以手動展開）

   • remove

     - 完全移除

   sidebar:
     display: post
              

   已知側欄在 `use motion: false` 的情況下不會展示。 影響版本5.0.0及更低版本。

設定 頭像

編輯 主題配置檔案， 修改字段

avatar

， 值設定成頭像的連結位址。其中，頭像的連結位址可以是：

頭像設定示例

avatar: http://example.com/avatar.png
           

設定 作者昵稱

編輯 站點配置檔案， 設定

author

為你的昵稱。

站點描述

編輯 站點配置檔案， 設定

description

字段為你的站點描述。站點描述可以是你喜歡的一句簽名:)

內建常用的第三方服務

百度統計

注意： baidu_analytics 不是你的百度 id 或者 百度統計 id

1. 登入 百度統計， 定位到站點的代碼擷取頁面
2. 複制

   hm.js?

   後面那串統計腳本 id，如：

1. 編輯 主題配置檔案， 修改字段

   baidu_analytics

   字段，值設定成你的百度統計腳本 id。

閱讀次數統計（LeanCloud） 由 Doublemine 貢獻

請檢視 為NexT主題添加文章閱讀量統計功能

Algolia 搜尋

詳細的配置請參考： 第三方服務 - Algolia

© Made by IIssNan