基於Hexo和Github搭建博客

搭建本身的我的博客。包括如下步驟：

準備工做

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

$ node -v
$ npm -v

安裝hexo

安裝hexo

$ npm install -g hexo

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

$ hexo v

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

npm install hexo --no-optional

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

$ cd blog
$ hexo init

npm安裝package.json中的依賴包

$ npm install

生成博客文件

$ hexo g

啓動本地博客

$ hexo s

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

查看hexo幫助

$ 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
   

2. 在跳轉界面填寫信息
   

生成測試頁面

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

建立ssh keys

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

$ ls -al ~/.ssh

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

$ ssh-keygen -t rsa -C "847909475@qq.com"

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

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

$ cat ~/.ssh/id_rsa.pub

給github倉庫添加ssh keys

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

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

測試鏈接

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

$ ssh -T git@github.com

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

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

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

1. 安裝hexo-deployer-git

$ npm install hexo-deployer-git --save

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

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

$ hexo g

1. 發佈

$ hexo d

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

切換主題

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

1. 下載TKL主題

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

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

而後，hexo g，再hexo d，便可正常訪問。
注：圖片url填寫，圖片文件夾img應放在source文件目錄下，url直接寫爲/img/圖片.png便可。

寫一篇博客

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 搭建博客