Hexo下Next主題配置與優化

使用Next主題

• 在這裏Downloads Next主題代碼
• 將下載的代碼放在myBlog/theme/next目錄下
• 設置站點myBlog/_config.yml的theme字段值爲next
• 生成新頁面hexo g
• 開啓服務hexo s –debug
• 發佈代碼hexo d

---

注：此時登陸網站，發現是空白的，打開控制檯，提示不少vendors目錄下的文件404，解決辦法是將next主題下即myBlog/themes/next/source下的vendors目錄名改成lib，並修改myBlog/themes/next/_config.yml的_internal: vendors改成_internal: lib。

參考：iissnan的回答

主題配置

主題風格設定

經過修改next主題下的_config.yml的scheme字段，配置不一樣的風格。

# Schemes
scheme: Muse
#scheme: Mist
#scheme: Pisces

本站點使用的是默認的Muse，顯示效果以下：

菜單設置

經過修改next主題下的_config.yml的menu字段，選定顯示的菜單項。

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

其中，home表明主頁，categories表明分類頁，about表明關於頁面，archives表明歸檔頁，commonweal表明404頁面（page not found時候顯示的頁面）。

菜單項文本修改是在對next主題下的language文件夾下的文件進行修改，若當前語言是簡體中文，直接修改language/zh-Hans.yml裏的對應字段便可。

本站點顯示主頁，分類頁，關於頁面和歸檔頁。

頭像設置

在主題下的source/images/下放置頭像文件avatar.gif便可。

設置文章代碼主題

Next主題總共支持5種主題，默認主題是白色的normal。經過修改next主題下的_config.yml的highlight字段，來設置代碼主題。

本站點使用的是night主題。即令highlight爲night。

添加標籤頁面

前面經過修改next主題下的_config.yml文件中的menu選項，能夠在主頁面的菜單欄添加標籤選項，可是此時點擊標籤，跳轉的頁面會顯示page not found。

添加標籤頁面的具體方法是：

• 新建頁面
  輸入以下命令：

$ cd myBlog
$ hexo new page tags

輸入命令後，在myBlog/source下會新生成一個新的文件夾tags，在該文件夾下會有一個index.md文件。

• 設置頁面類型
  在上步新生成的myBlog/source/tags/index.md中添加type: 「tags」，index.md文件內容以下：

--- title: tags
date: 2016-11-15 19:10:05
type: "tags" ---

• 設置具體文章的tags
  當要爲某一篇文章添加標籤，只需在myBlog/source/_post目錄下的具體文章的tags中添加標籤便可，如：

--- title: 基於Hexo和Github搭建博客
date: 2016-11-09
tags: [npm, hexo, github]
categories: 搭建博客 ---

本站添加爲標籤後的效果以下：

添加分類頁面

步驟與添加標籤頁面相似，具體以下：

• 新建頁面
  輸入以下命令：

$ cd myBlog
$ hexo new page categories

輸入命令後，在myBlog/source下會新生成一個新的文件夾categories，在該文件夾下會有一個index.md文件。

• 設置頁面類型
  在上步新生成的myBlog/source/categories/index.md中添加type: 「categories」，index.md文件內容以下：

--- title: categories
date: 2016-11-15 19:11:13
type: "categories" ---

• 設置具體文章的categories
  當要爲某一篇文章添加分類，只需在myBlog/source/_post目錄下的具體文章的categories中添加分類便可，如：

--- title: 基於Hexo和Github搭建博客
date: 2016-11-09
tags: [npm, hexo, github]
categories: 搭建博客 ---

本站添加爲標籤後的效果以下：

添加關於我頁面

步驟與添加標籤頁面相似，具體以下：

• 新建頁面

$ cd myBlog
$ hexo new page about

輸入命令後，在myBlog/source下會新生成一個新的文件夾about，在該文件夾下會有一個index.md文件。

• 修改about/index.md
  本站點index.md以下：

--- title: about
date: 2016-11-15 19:08:50 ---
## 關於我
一隻學習後端的小菜鳥，歡迎分享知識。

參考連接

• Hexo的Next主題配置