基於Hexo和Github搭建博客

準備工作

確保電腦需要已下載安裝node和npm。查看安裝是否成功，windows只需在命令行輸入以下兩條命令即可。

1 2	$ node -v $ npm -v

安裝hexo

安裝hexo

1	$ npm install -g hexo

檢測hexo版本來確保hexo是否成功安裝

1

$ hexo v

注：可能報錯，可以試試執行

1	npm install hexo --no-optional

進入本地工程目錄，初始化hexo

1 2	$ cd blog $ hexo init

npm安裝package.json中的依賴包

1	$ npm install

生成博客文件

1

$ hexo g

啓動本地博客

1

$ hexo s

此時在瀏覽器輸入http://localhost:4000即可訪問默認主題的hexo博客

查看hexo幫助

1	$ hexo help

修改全局配置文件

對本地blog目錄下的_congig.yml進行修改配置即可。

網站

參數	描述
title	網站標題
subtitle	網站副標題
description	網站描述
author	您的名字
language	網站使用的語言
timezone	網站時區。Hexo 默認使用您電腦的時區。時區列表。比如說：America/New_York,Japan, 和 UTC 。

網址

參數	描述	默認值
url	網址
root	網站根目錄
permalink	文章的 永久鏈接 格式	:year/:month/:day/:title/
permalink_default	永久鏈接中各部分的默認值

目錄

參數	描述	默認值
source_dir	資源文件夾，這個文件夾用來存放內容。	source
public_dir	公共文件夾，這個文件夾用於存放生成的站點文件。	public
tag_dir	標籤文件夾	tags
archive_dir	歸檔文件夾	archives
category_dir	分類文件夾	categories
code_dir	Include code 文件夾	`downloads/code
i18n_dir	國際化（i18n）文件夾	:lang
skip_render	跳過指定文件的渲染，您可使用 glob 表達式來匹配路徑。

文章

參數	描述	默認值
new_post_name	新文章的文件名稱	:title.md
default_layout	預設佈局	post
auto_spacing	在中文和英文之間加入空格	false
titlecase	把標題轉換爲 title case	false
external_link	在新標籤中打開鏈接	true
filename_case	把文件名稱轉換爲 (1) 小寫或 (2) 大寫	0
render_drafts	顯示草稿	false
post_asset_folder	啓動 Asset 文件夾	false
relative_link	把鏈接改爲與根目錄的相對位址	false
future	顯示未來的文章	true
highlight	代碼塊的設置

分類 & 標籤

參數	描述	默認值
default_category	默認分類	uncategorized
category_map	分類別名
tag_map	標籤別名

日期 / 時間格式

Hexo 使用 Moment.js 來解析和顯示時間。

參數	描述	默認值
date_format	日期格式	MMM D YYYY
time_format	時間格式	H:mm:ss

分頁

參數	描述	默認值
per_page	每頁顯示的文章量 (0 = 關閉分頁功能)	10
pagination_dir	分頁目錄	page

擴展

參數	描述
theme	當前主題名稱。值爲false時禁用主題
deploy	部署部分的設置

配置github

新建倉庫

1. 登錄github，點擊右上角加號，點擊new respository

1. 在跳轉界面填寫信息

生成測試頁面

進入新建的倉庫，點擊右上角的settings，在跳轉頁面點擊 launch automatic page generator，在跳轉頁面點擊continue to layouts，接着選擇主題，生成頁面，約15min後，訪問https://syd1992.github.io，即可顯示生成測試頁面

創建ssh keys

1. 檢測ssh keys是否已存在，即id_rsa，id_resa.pub是否存在

1	$ ls -al ~/.ssh

1. 生成ssh keys（若ssh keys不存在）

1	$ ssh-keygen -t rsa -C "[email protected]"

輸入命令後，會提示輸入ssh keys保存位置，一般無需改，直接回車即可；接着提示輸入密碼，並確認再次輸入密碼，這個密碼後面會有使用，一定要記住！

1. 查看生成的ssh keys中的公鑰

1	$ cat ~/.ssh/id_rsa.pub

給github倉庫添加ssh keys

1. 點擊創建的倉庫右上側的settings，在跳轉頁面左下側點擊deploy keys

1. 在跳轉頁面點擊add deploy keys，title隨意填，在key部分將創建ssh keys步驟中的id_rsa.pub內容粘貼在該部分

測試連接

執行命令，輸入命令後，問yes/no，輸入yes即可，提示輸入密碼，則輸入生成ssh keys時設置的密碼

1	$ ssh -T [email protected]

最後提示如下內容，表示成功

1	Hi, 用戶名/用戶名.github.io! You've successfully authenticated, but GitHub does notprovide shell access.

配置根目錄下的_config.yml文件併發布

1. 安裝hexo-deployer-git

1	$ npm install hexo-deployer-git --save

1. 修改_config.yml的deploy內容，如下圖

1. 生成博客文件，每次修改本地文件後，都要執行該命令

1

$ hexo g

1. 發佈

1

$ hexo d

此時，訪問https://syd192.github.io.git即可看到自己的辛勤勞動成果咯！！

切換主題

默認主題是landscape，如果不太喜歡，可以訪問這裏獲取更多的主題。本人選擇主題是TKL，具體切換方法如下：

1. 下載TKL主題

1	$ git clone https://github.com/SuperKieran/TKL.git theme/TKL

1. 配置根目錄下的_config.yml文件

然後，hexo g，再hexo d，即可正常訪問。

注：圖片url填寫，圖片文件夾img應放在source文件目錄下，url直接寫爲/img/圖片.png即可。

寫一篇博客

1. 新建博客

1	$ hexo new "newBlog"

1. 在根目錄下source文件夾下找到對應的newBlog.md文件，按照markdown規則，編寫博客。

   在該newBlog.md文件的頭部，可以對該博客進行配置，如博客標題title，博客創建時間date，所屬分類categories，標籤tags

然後，hexo g，再hexo d，即可正常訪問。

最後來張成果圖，繼續加油咯~~~~

參考鏈接

1. 史上最詳細的Hexo博客搭建圖文教程
2. 使用hexo搭建github.io博客(一)
3. 基於 Hexo 和 GitHub Pages 搭建博客