Github Pages + Hexo 设计你的免费 blog

我之前在 Window 下使用 Github Pages + Hexo 搭建了一个免费的 blog，后来由于某些原因我重新在 Ubuntu 下重建了一下我的 blog。在重建过程中遇到了很多，折腾了好久才解决掉。遂写下这篇博文，分享这些 tips，万一哪天手贱了又需要重建，也可以少走写弯路。

我当初选择用 Hexo 来搭建 blog，是因为 Hexo 可以很方便地部署到 GitHub Pages 上，另外使用起来也很简单，高扩展性、自订性，支持 Markdown。

使用 Github Pages + Hexo 搭建 blog 共分一下五步走。

安装 Git

Ubuntu 默认安装了 Git，如果没有，可以使用以下命令安装：

$ sudo apt-get install git-core

安装完成之后，配置一下 username 和 email：

$ git config --global user.name "your name"
$ git config --global user.email "your.email@example.com"

安装 Node.js

利用 n 或者 nvm 来安装和管理 Node 的版本。更多的介绍可以看 NVM 的 Github 主页 以及 利用 n 和 nvm 管理 Node 的版本 。

NVM 的安装可以使用以下命令：

$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.25.4/install.sh | bash

或者

$ wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.25.4/install.sh | bash

以上脚本会把 nvm 库 clone 到 ~/.nvm ，然后会在 ~/.bash_profile , ~/.zshrc 或 ~/.profile 末尾添加 source。安装完成之后，你可以用以下命令来安装 node：

$ nvm install 0.10

这里的 0.10 就是 Node.js 的版本号。安装完成之后，需要配置一下默认的版本，否则你在命令行执行 node 会得到找不到 node 命令的错误：

$ nvm alias default 0.10

安装 Hexo

这里我按照官方的指导来安装的 Hexo，具体可以查看 Hexo 的官方文档 。

$ npm install hexo-cli -g
$ hexo init blog
$ cd blog
$ npm install
$ npm install hexo-deployer-git --save

几点说明：

• blog 目录是 hexo 在本地的初始化目录，以后操作 blog 都是在此目录下。
• 如果找不到 hexo 命令，你可以查找目录 ~/.nvm/v0.10.32/bin 下是否有 hexo -> ../lib/node_modules/hexo-cli/bin/hexo，可以尝试手动创建软连接：

$ ln -s ～/.nvm/v0.10.32/lib/node_modules/hexo-cli/bin/hexo ～/.nvm/v0.10.32/bin/hexo

• 安装 hexo-deployer-git 时要在 blog 目录下执行命令，否则 deploy 的是会找不到 git 。
• hexo 相关的命令都是在 blog 目录下执行

安装完成之后你可以执行以下命令，打开浏览器输入 localhost:4000 查看：

$ hexo generate
$ hexo server

部署到 Github

1. 注册 Github 账号
   已有账号可以跳过，没有的，请 在此进行注册 。记得取一个帅帅的用户名，因为你的 blog 地址和这个有关。

2. 设置 SSH
   ssh 的介绍和设置方法请看 官方教程 。

3. 创建 repository
   在自己 Github 主页右下角，创建一个名为 “username” + “.github.io” 的 repository。比如我的 Github 账号是 iamwent，那么我应该创建的 repository 名字应该是 iamwent.github.io 。

4. 部署
   编辑站点的 _config.yml，要把下面的 iamwent 都换成你的用户名：

deploy:
  type: git
  repo: https://github.com/iamwent/iamwent.github.io.git
  branch: master

如果使用以下 repo，则不需要每次 deploy 的时候都输入 Github 的用户名和密码：

git@github.com:iamwent/iamwent.github.io.git

执行下列指令即可完成部署，然后在 username.github.io 查看你的 blog 。

$ hexo generate
$ hexo deploy

更换主题

我安装了 NexT 主题，你可以在 Github 主页 上查看如何安装以及配置。另外 xirong 的 Github 有更多的介绍。我就不一一赘叙了。

一些坑

多说绝对是个巨坑。

在 NexT 的 wiki 上说，使用 duoshuo_shortname 。那到底 duoshuo_shortname 是什么呢？折腾了很久之后我才搞定它。

你直接在 多说官方网站 上用微博之类的授权登陆是找不到 duoshuo_shortname 的，你需要在 这里注册 才行。注册时填写的用户名就是我们所需要的 duoshuo_shortname 。

Tips

1.hexo 支持简化命令：

hexo g == hexo generate
hexo d == hexo deploy
hexo s == hexo server
hexo n == hexo new

2.hexo 常用复合命令：

hexo d -g #生成加部署，等同于 hexo g -d
hexo s -g #生成加预览

3.主页文章显示摘要
编辑md文件的时候，在要作为摘要的文字后面添加 <!--more--> 即可

4.新文章的文件名称自动添加日期，在站点的 _config.yml 中修改以下配置

new_post_name: :year-:month-:day-:title.md # File name of new posts

优化无止境，慢慢折腾吧。

参考链接

• zippera’s blog 有详细而完整的教程，我最初就是据此搭建的 blog 。
• xirong hexo-theme-next 有 NexT 主题的优化配置，很详细。
• Xuanwo’s Blog 有一些常见错误的解决方案。