使用 Hexo 在 GitHub 上建立博客 · Utopia's Daily Note

使用 Hexo 在 GitHub 上建立博客

#

写在前面

其实我在一月份的就开始写了三篇博客文章，你没有看错，只是写了三篇，然后，就没有然后了。我还在其中一篇文章中写着，不知道自己能够坚持多久。事实是，为大约坚持了两天。于是，就停止了更新。这真的很让人汗颜。不过，现在想想。之前所用的框架可能确实也不如这个方便。之前用的是 jekyll ，其实就是通过 GitHub 自己生成静态页面。但是总是需要在提交代码后更新 gh-Pages 。感觉有点麻烦。而且有时候还是会有延时才能生成。总是感觉不那么痛快。于是在今天选了 Hexo 来写自己的博客网站。目前看来这个基于 node.js 的静态页面生成器还是不错的。不知道后续的表现会怎么样。反正可以直接配置部署，这点还是很好的。还有就是比较详细的中文文档，其实这点也还是很有诱惑力的。

不过在部署这个 Hexo 的过程中，还是会有一些不是问题的问题。我还是简单记录一下的比较好。防止以后我忘记了。其实写个博客的主要目的之一，就是把自己干过的事情能有个可以方便查阅的地方记录一下。不然和故事里狗熊掰棒子一样了。一边在努力的解决问题，一边就很及时的把解决过的问题忘记了。

在使用 GitHub 开设自己的免费文库的时候，请记住，GitHub 对于 Pages 页面是有相应的要求的，比如每小时提交不能超过 10 次，还有就是相关容量的限制。这些大家可以看他们的文档里，会有相关的介绍。不过，用于一般用途的博客类页面，应该是不会超过这类限制的。除非你真的是很牛了。

下面就开始正题吧，如何使用 Hexo 在 GitHub 上建立自己的博客。里面的内容基本都是收集自网络。因此，我会在文章的末尾把里面引用过的文章超链接都留下。这也是一种学术上的惯例。也就是你引用别人的内容本身是可以的，但是如果你不说出来，那就是抄袭。这个很多开源软件所使用的协议是类似的。你可以使用那些代码。但是代码里的协议和相关信息，你是需要保留的，同时，你要在自己的程序中声明使用了这些程序。

使用 Hexo 在 GitHub 上建立博客

首先你要有一个 GitHub 帐号

这个说起来感觉是笑话，请不要笑。真的会有人忽略这一步。不过具体步骤请参见相关的文档。这里不是我要叙述的重点。

在 GitHub 上建立相应的 Respositiry

在这里大部分文档都不会告诉你，其实在 GitHub 中的 Pages 功能是分为两种的。分别是 User Pages 和 Project Pages, 区别如下:

	User Page	Project Page
是否多个	一个帐号只有一个	可以有多个, 每个repo都可以有对应的Project page
Repo and Branch	Repo 名必须为 <username>.github.io , 页面在 master 上	Repo 名随意, 页面必须在分支gh-pages下
URL	http(s)://<username>.github.io	http(s)://<username>.github.io/<projectname>

我之前建立的是使用的项目下的 Pages 页面，所以需要使用项目名称才能访问。现在这个使用的是用户级别的页面，只有这一个。不过确实路径短了很多。我是个特别懒的人，所以希望这些东西是越简单越好。

使用 Hexo 建立博客

后续的操作是按照我所是使用的 OpnSuse 所写的，在其他操作系统下是类似的。

安装 Hexo 的相关依赖准备

其实在 Linux 这类系统使用这种编译的东西是很方便的。命令行可以很快的解决很多问题。比如官方文档提出需要 Git 和 Node.js .其实这两样在连着网的 Linux 下安装简直是很爽的。我看了一下，需要 npm，于是只要安装 npm 就好了， node.js 会自动以 npm 依赖的方式自动安装上的。

sudo zypper install npm

至于 Git 本来是基本每个常规 Linux 都自带的。即使没有初始化安装也可以通过类似的命令行进行安装。

安装 Hexo

sudo npm install -g hexo-cli

等着终端里的字符不滚动了，就会提示你已经安装好了。

建站

这个名称是来自与官方文档的，总感觉怪怪的。

安装 Hexo 完成后，请执行下列命令，Hexo 将会在指定文件夹中新建所需要的文件。

hexo init <folder>

配置

这个时候，进入刚才生成的那个文件夹。可以在 _config.yml 中修改大部份的配置。

网站

大专栏  使用 Hexo 在 GitHub 上建立博客 · Utopia's Daily Note

参数	描述
title	网站标题
subtitle	网站副标题
description	网站描述
author	您的名字
language	网站使用的语言

其中，description 主要用于 SEO，告诉搜索引擎一个关于您站点的简单描述，通常建议在其中包含您网站的关键词。author 参数用于主题显示文章的作者。

网址

参数	描述	默认值
url	网址
root	网站根目录	:year/:month/:day/:title/
permalink_defaults	永久链接中各部分的默认值

网站存放在子目录
如果您的网站存放在子目录中，例如 http://yoursite.com/blog ，则请将您的 url 设为 http://yoursite.com/blog 并把 root 设为 /blog/。

我只是改了上面的两部分的内容，还有有别的内容，可以参考一下官方文档。

生成静态页

其实，在生成这个项目的时候，是自带了一个示例页面的。位置在 resourse/_post 下。格式是 markdown 的。基本上都是在写这个格式。不用担心排版的事情，还是很省心的。

hexo g

此时会生成静态页面，页面存放在项目下面的 public 文件夹下。

在这个时候其实你有两种选择发布这些页面，一种就是通过 Git 客户端，直接把这些页面放置在 master 分支下。还有一种选择，就是使用这个框架自带的发布工具。

使用 Hexo 自带工具发布

首先要执行的就是安装一个依赖工具。记住，不要偷懒，不要省略后面的 –sava 参数。我省略了，然后就不能正常工作。

sudo npm install hexo-deployer-git --save

然后回到 _config.yml 中修改参数。

参数	描述
repo	库（Repository）地址
branch	分支名称。如果您使用的是 GitHub 或 GitCafe 的话，程序会尝试自动检测。
message	自定义提交信息

在这个步骤上我也出现过错误。就是在啊设置仓库地址的时候。最好是从 github 上直接粘贴那个地址。而不是使用有些文章中所说的地址。

配置妥当以后，执行如下命令：

hexo d

这个命令会直接把本地的代码推送至你的 GitHub 仓库。

刷新浏览器就应该能够看到已经存在的示例页面了。

写篇文章

其实这个框架还有一个好处是可以直接通过命令生成一个空文章。之前我用的框架，我是没有发现有这个功能。虽然不复杂。但是很好用啊。

hexo new [layout] <title>

我还没有尝试这里使用中文的名字。我一般是先用英文，然后进入以后，把里面的 title 字段再改为中文的。

关于布局还是有3种的，这里用了默认的布局。默认布局也是可以随时通过调整配置文件来调整的，很方便。

至此，基本上就可以使用这个框架来写文章了。不过突然我想着要加个图片。这可以有两种方式。一种是通过七牛的云服务来实现的。这个载入速度会很快。而且还并不占用你的 GitHub 空间。很好。还有就是简单一些的。当 Hexo 项目中只用到少量图片时，可以将图片统一放在 source/images 文件夹中，通过 markdown 语法访问它们。

放置路径：

source/images/image.jpg

文章中的引用方法：

![](/images/image.jpg)

如果还有别的补充，我可能会写篇新的，或者干错在这后面接着写。

参考文档

1. 利用 GitHub 写博客的几种方式

2. 我的博客是如何搭建的（github pages + HEXO + 域名绑定）

3. hexo 的官方文档

4. Hexo博客搭建之在文章中插入图片

5. 部署 Hexo 静态博客至七牛