Hexo 是一个跟WordPress，Jekyll一样的博客框架，也许你很好奇为什么要用Hexo而不是其它框架，这个世界上好些事情没有原因，一切只是凑巧，前段时间，一直想搭一个个人的博客，而在Hexo上搜到了喜欢的主题，所有就顺便用了Hexo。如果你想快速搭建自己的博客，建议先在上面几个框架的官网里，找到自己喜欢的主题，然后再决定用什么框架。
在搭建网站的时候除了用了Hexo，还用了Swig模板语言。Hexo上的主题基本上都是Swig语言写的，所以需要了解Swig模板怎么写。关于Swig语言的使用，我在后面会单独写一篇文章。另外小编的博客是托管在Github上面的。
安装
安装Git，之所以安装Git是因为博客是托管在GitHub上面，所以每次发布的文章需要提交上去，还有我们喜欢的主题也需要通过Git从GitHub上拉取
Mac用户，先安装Xcode，再在Xcode里面安装命令行工具，方法是启动Xcode，进入 Preferences -> Download -> Command Line Tools -> Install 安装命令行工具
安装 Node.js，安装方法自己找资料
1
2
3
4//全局安装
$ npm install -g hexo-cli
//也可以当前目录安装
$ npm install hexo安装以后，将 Hexo 所在的目录下的
node_modules添加到环境变量之中即可直接使用1
echo 'PATH="$PATH:./node_modules/.bin"' >> ~/.profile
创建网站项目
建立网站项目
1
2
3$ hexo init <folder>
$ cd <folder>
$ npm install配置根目录下的_config.yml
scaffolds：放的是一些模板文件，当你使用hexo new 命令的时候，会根据这些模板创建swig文件
source：资源文件夹是存放用户资源的地方。除
_posts文件夹之外，开头命名为_(下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到public文件夹，而其他文件会被拷贝过去。themes：我们下载的主题就放到这个里面
source：我们网站中用的的多媒体资源，比如图片可以放到这个文件夹下，然后通过类似于
的方法访问它们。source/_data：此文件夹下放一些数据文件，比如YAML 或 JSON，这些文件会自动加载
让网站跑起来
我们直接去Hexo的官网下载主题，下载完后将目录拷贝到项目的theme下面，本博客主题地址链接：https://github.com/frostfan/hexo-theme-polarbear.git
使用下面的命令编译我们的项目，并生成publish
1
$ hexo g
使用下面的命令启动服务器
1
hexo server
然后在浏览器里面输入
http://localhost:4000/，理论上我们的网站就可以跑起来了，端口号可以在_config.yml中配置要上传到GitHub前需要运行下面的命令进行部署
1
$ hexo deploy
还有一个常用的命令，其他命令就不讲了，暂时没用到
1
$ hexo clean
如何写一篇文章
写文章需要用下面命令新建一个Markdown文件，会在source/_post下面生成md文件
1 | hexo new 泰国游记 |
创建完之后，打开md文件，发现文件的头部已经有了一些内容，头部最常用的几个字段是title（标题），date（日期），tags（标签），categories（分类），comments（是否开启评论），分类和tags可以定义多个，每起一行加前缀-
1 | --- |
在Hexo里写文章用的是Markdown，除了Markdown的基本语法可用外，Hexo也为我们提供了一些更为强大的标签插件，下面是几个常用的：
插入引言，可包含作者、来源和标题。
1
2
3{% blockquote %}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque hendrerit lacus ut purus iaculis feugiat. Sed nec tempor elit, quis aliquam neque. Curabitur sed diam eget dolor fermentum semper at eu lorem.
{% endblockquote %}插入代码块，可指定语言
1
2
3{% codeblock lang:objc %}
[rectangle setX: 10 y: 10 width: 20 height: 20];
{% endcodeblock %}插入指定大小的图片
1
{% img [class names] /path/to/image [width] [height] '"title text" "alt text"' %}
文章摘要和截断
1
2
3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
<!-- more -->
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.首页中将只会出现
1
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
正文中则会出现
1
2
3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
全局变量
Hexo提供了一些全局变量，以方面我们在Swig模板文件中使用，这些变量基本上可以获取博客里面所有的内容，具体可参考官方文档
在Github搭建自己的博客
在Github上创建一个仓库，一定注意下面几个地方，第一是保证Owner和Repository name的两个名字一样，第二一定选择Public，Private小编试了好像不行，大概如下图的设置基本上就可以了
-
1
$ npm install hexo-deployer-git --save
修改_config.yml，type写git，repo是git仓库地址，branch选择master，message是提交日志
1
2
3
4
5deploy:
type: git
repo: https://bitbucket.org/JohnSmith/johnsmith.bitbucket.io
branch: master
message: log执行下列命令，将public推送到github仓库
1
2
3
4//必须先清理，不然删文件不会生效
hexo clean
//推送
hexo deploy执行完以上命令，大概等个20秒左右的样子，刷新主页后生效
踩的一些坑
- 刚开始的时候图片存在source/images下面，发现部署完之后，图片加载很慢，所以图片尽量存在图床上面，推荐聚合图床，图床网站一般有加速功能，可以提高页面的加载速度