Hexo + Github Pages 搭建个人博客

发表于 更新于 分类于 阅读次数： Valine：

自由畅快的写博客；

1. 安装Homebrew

# Install Homebrew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

# Check
brew --version

2. 安装Node.js & npm

# Install Node.js
brew install node

3. Hexo牛刀小试

# 安装hexo-cli
npm install hexo-cli -g

# 使用Hexo初始化你的Blog目录
mkdir hexo
cd /Users/tiansj/hexo
hexo init blog   # INFO Cloning hexo-starter to ~/hexo/blog
cd blog
npm install

# 启动Server，访问127.0.0.1:4000
hexo server

# 创建一个新文章
hexo new "Hello Hexo" 
#会在blog/source/_posts下创建Hello-Hexo.md，剩下的写作可以选择任何Markdown工具自由写作

# 生成静态文件（blog/public）
hexo generate
hexo server
# 再次启动，可以看到写做新文章了

4. 设置主题

这里用的是hexo-theme-tranquilpeak

# 下载喜欢的主题，注意这个主题需要grunt build后才能应用，如果你不想折腾，直接下载生产版本，见上面站点 Quick start 第一项下载最新版本
git clone https://github.com/tianshaojie/hexo-theme-tranquilpeak.git themes/tranquilpeak

# 修改blog/_config.yml (hexo clean/generate/server)新主题已应用
theme: tranquilpeak

# 个性化自己的信息
/blog/theme/tranquilpeak/__config.yml

5. 生成导航页面，分类页、标签页、文章列表页

在~/hexo/blog/下执行命令
hexo new page "all-categories"
hexo new page "all-tags"
hexo new page "all-archives"

6. 编辑/source/各个目录下的index.md，重启后导航即生效

---
title: "all-categories"
layout: "all-categories"
comments: false
---
---
title: "all-tags"
layout: "all-tags"
comments: false
---
---
title: "all-archives"
layout: "all-archives"
comments: false
---

7. 配置Deploy，自动部署到Github上

# 先生产你的GitHub Pages页面
# 修改blog/_config.yml中的deploy项

deploy:
  type: git
  repository: git@github.com:username/username.github.com.git
  branch: master
# 在~/hexo/blog下执行
npm install hexo-deployer-git --save

# 自动部署命令，然后华丽丽的看你的网站吧
hexo deploy

8. OK，自由的写文章

1. hexo new "<<文章名>>"，新建文章
2. ~/hexo/blog/source/_post 下找到对应<<文章名>>.md文件，自由编辑
3. hexo g，生成静态html文件
4. hexo s，部署到线上
其他：
1. 只显示摘要，只需要在你想展示内容的位置，添加一行：<!-- more -->
2. 设置Tab：tags: [Hexo,Github]
3. 设置分类category: Hexo
4. Markdown文章内显示图：
	* 图片统一放在source/images文件夹 （source/images/image.jpg）
	* 引用：![](/images/image.jpg)

9. 参考链接

Hexo中文官方文档
hexo-theme-tranquilpeak主题文档