一、介紹

Hexo是一款快速、簡潔且高效的博客框架，支持markdown等語法，另外具有強大的插件系統(tǒng)和眾多的插件，高度可定制。

github是目前最為流行的源碼托管網(wǎng)站之一，我們在創(chuàng)建github賬戶時，會被分配一個靜態(tài)的虛擬服務器（只能伺服靜態(tài)資源，并且每月有流量限制，不過也綽綽有余）。訪問<用戶名>.github.io這個地址，實際上就是我們的github個人主頁。

二、安裝

1. 最新版本的GIT與Node.js
2. 安裝Hexo腳手架

npm install -g hexo-cli

三、建站

請執(zhí)行如下命令創(chuàng)建一個工程目錄。

hexo init <folder>
cd <folder>
npm install

你會得到如下目錄：

├── _config.yml
├── package.json
├── scaffolds
├── source
|   └── _posts
└── themes

_config.yml

網(wǎng)站的配置信息，您可以在此配置大部分的參數(shù)。

package.json

應用程序的信息。EJS, Stylus 和 Markdown renderer 已默認安裝，您可以自由移除。

scaffolds

模版文件夾。當您新建文章時，Hexo 會根據(jù) scaffold 來建立文件。

Hexo的模板是指在新建的markdown文件中默認填充的內(nèi)容。例如，如果您修改scaffold/post.md中的Front-matter內(nèi)容，那么每次新建一篇文章時都會包含這個修改。

source

資源文件夾是存放用戶資源的地方。除 _posts 文件夾之外，開頭命名為 _ (下劃線)的文件 / 文件夾和隱藏的文件將會被忽略。Markdown 和 HTML 文件會被解析并放到 public 文件夾，而其他文件會被拷貝過去。

themes

主題文件夾。Hexo會根據(jù)主題來生成靜態(tài)頁面。

四、配置

我們可以在_config.yml中修改大部分的配置，其中有些配置是必須要修改的。

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://halzhan.cn # 填入博客地址
root: / # 如果博客地址在子目錄，請將子路徑填入
permalink: :year/:month/:day/:title/
permalink_defaults:

另外一個是站點的基礎配置：

# Site
title: Hal Zhan # 站點標題
subtitle: 不拘一格、Geek # 站點副標題
description: 
author: Hal Zhan(風起云涌Hal) # 作者
language: zh-Hans # 編碼（漢字的話使用這個既可以了）
timezone:

其他的配置詳見官方文檔-配置。

完成上述配置后，我們可以使用hexo server本地伺服站點。如果需要在控制臺中顯示更多debug信息，可以加上--debug選項。

五、發(fā)布

我們需要在github上預先創(chuàng)建一個空的倉庫，請注意這個倉庫的名稱必須叫做：<用戶名>.github.io，例如本例中的倉庫名稱叫做：halzhan.github.io。

我們需要將本地目錄與遠程倉庫聯(lián)系起來。回到根目錄下，執(zhí)行如下命令：

git init
...
git add .
git commit -m "init project"
git remote add origin "git@github.com:HalZhan/halzhan.github.io.git"
git push origin master

注：推薦再創(chuàng)建一個分支（本例中創(chuàng)建了一個hexo分支），用于保存我們的站點源碼，而master分支用于存放最終發(fā)布的站點文件。

git checkout -b hexo

安裝一個模塊：

npm install --save hexo-deployer-git

再回到根目錄下_config.yml文件中，對發(fā)布選項做一些配置：

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:HalZhan/halzhan.github.io.git # Git地址（http/https/ssh皆可）
  branch: master # 所要發(fā)布到的分支名稱

發(fā)布的話請使用如下命令：

hexo clean && hexo g && hexo d

再次訪問<用戶名>.github.io，如果一切順利應該可以看到剛剛發(fā)布的站點。

六、主題

github上有許多非常優(yōu)秀的hexo主題，這里推薦一個比較流行的主題，next，首先需要將這個主題下載到我們的項目里：

git clone https://github.com/iissnan/hexo-theme-next.git themes/next

返回到項目根目錄下的_config.yml文件中，搜索字段theme，將其值改為next，然后可以執(zhí)行命令hexo server --debug本地查看一下效果。

next主題有許多配置選項，我們可以在themes/next目錄下更改_config.yml里選項的值。

例如顯示社交鏈接：

social:
  GitHub: https://github.com/halzhan || github # github地址
  E-Mail: mailto:halzhan163@163.com || envelope # 郵件
  Weibo: https://weibo.com/halzhan || weibo # 微博主頁
  LinkedIn: https://www.linkedin.com/in/hal-zhan-a0041587/ || linkedin # 領英主頁
  #Google: https://plus.google.com/yourname || google
  #Twitter: https://twitter.com/yourname || twitter
  #FB Page: https://www.facebook.com/yourname || facebook
  #VK Group: https://vk.com/yourname || vk
  #StackOverflow: https://stackoverflow.com/yourname || stack-overflow
  #YouTube: https://youtube.com/yourname || youtube
  #Instagram: https://instagram.com/yourname || instagram
  #Skype: skype:yourname?call|chat || skype

顯示查看更多按鈕（首頁文章內(nèi)容截取，這樣就不會在首頁展示全部內(nèi)容）

# Automatically Excerpt. Not recommend.
# Please use <!-- more --> in the post to control excerpt accurately.
auto_excerpt:
  enable: true
  length: 150

啟用Gemini風格的next主題：

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

每種主題都會有許多配置選項，可以自行嘗試修改并查看效果。

七、SEO優(yōu)化

八、常見問題

1. 主題同步

這個問題是比較頭疼的，因為目前hexo主題都是通過git clone的方式克隆到本地來的，然而在提交站點源碼到遠程倉庫時，themes文件夾下的主題文件是不會提交到倉庫里的，因此我們?nèi)绻牧酥黝}文件下的一些設置，這部分設置由于沒有提交會被丟失，這帶來了極大的不便。為此，我們決定采用官方推薦的fork+subtree的方式來管理主題。

• 刪除themes目錄下的next文件夾，并將修改push到github

git add .
git commit -m "delete next"
git push

• 進入next的github主頁，fork之

• 待fork完成后綁定next主題為子項目

git remote add -f next git@github.com:HalZhan/hexo-theme-next.git
git subtree add --prefix=themes/next next master --squash

• 更新子項目

git fetch next master
git subtree pull --prefix=themes/next next master --squash

• 從子目錄push到遠程倉庫

git subtree push --prefix=themes/next next master

• 提交并發(fā)布本地修改到遠程倉庫

git add .
git commit -m "next theme"
git push

現(xiàn)在再去遠程倉庫看themes/next/就有內(nèi)容了，并且跟子項目的遠程倉庫可以保持更新，在主項目中修改也可以push到子項目的遠程。這樣就不必擔心主題配置丟失了。