开始使用Hexo写博客

发表于   |   分类于   |     |  

之前一直在WordPress上写博客，后来无意中发现了Jekyll这个静态博客引擎，突然觉得静态博客这个概念很有意思。看到很多人都开始使用Markdown了，对比了一下各自的优缺点，就想转过去。无奈自己几乎就是个前端文盲，对前端的东西简直是一窍不通啊，连Html标签都记不全，也是在懒得去花时间折腾。于是，暂时就放下了。前几天，把自己的电脑重做了系统，装了虚拟机，又突然冒出搭建静态博客的想法了。随便搜了一下，发现有人推荐Hexo，就试着安装了，花了两天时间总算是搞定了。Hexo的作者在这儿——tommy351，首先必须要感谢tommy！

##安装环境
虽说部署Hexo有Windows解决方案，但是心理上总觉得搞这东西用Windows实在是不纯粹，这是我的环境：

  • Hexo: 2.4.5
  • OS: Linux 2.6.32-431.3.1.el6.x86_64 linux x64
  • http_parser: 1.0
  • node: 0.10.25
  • v8: 3.14.5.9
  • ares: 1.9.0-DEV
  • uv: 0.10.23
  • zlib: 1.2.3
  • modules: 11
  • openssl: 1.0.1e

首先，先说Hexo的安装吧！题外话：我始终觉得安装操作系统一定要选择Software Development Workstation，以前总自作聪明选择最小化安装，结果也就不提了，俩字：巨坑！

##安装过程

###安装node
安装node之前，首先要确认自己的Python版本是否支持，如果是较低版本的Python，推荐2.7版本则要先下载编译安装Python：

1
2
3
4
5
6
7
yum install bzip2* -y              #nodejs模块必须的
wget http://python.org/ftp/python/2.7.6/Python-2.7.6.tar.xz
tar -zxvf Python-2.7.6.tar.xz
cd Python-2.7.6
./configure
make && make install
/usr/local/bin/python2.7 -V     #查看Python版本

编译安装完成，但是如果不修改软链接指向的话，系统默认的Python版本依然是2.4，而yum必须要有Python2.4才能工作的，所以必须保证2.4和2.7共存，这时候要做的就是修改软链接指向：

1
2
3
4
cd /usr/bin
mv python python2.4
ln -s /usr/local/bin/python2.7 /usr/bin/python
python -v                                #查看Python版本

然后就是修复修改了默认Python版本yum不能工作问题：

1
2
vi /usr/bin/yum
/usr/bin/python————→/usr/bin/python2.4  #将—————→左边的用右边的替换

接下来就是安装Node了：

1
2
3
4
5
wget http://nodejs.org/dist/v0.10.25/node-v0.10.25.tar.gz
tar zxvf node-v0.10.25.tar.gz
cd node-v0.10.25
./configure --prefix=/opt/application/node
make && make install

将Node添加进环境变量，我的Shell环境是Zsh，只需要在export PATH后面添加如下路径即可：

1
:/opt/application/node/bin

###安装使用Hexo
安装Hexo非常简单，这是Hexo的说明文档

1
2
npm install -g hexo
hexo init HexoSource        #根据个人实际情况把HexoSource替换为自己想要设置的目录名

进入文件夹HexoSource，可以看到配置文件_config.yml，在这里主要配置需要上传到github或者其他托管网站的路径，安装一些插件和主题。需要特别注意的是，_config.yml里面的配置项类似于key: value的形式，这个冒号后面的空格一定不能少！

####配置Hexo
安装主题需要制作或者下载自己所需要的主题，然后放在根目录下的theme文件夹下，然后在_config.yml里将默认的landscape修改为自己的主题名即可。

安装插件，在这里可以看到各种插件，然后用下面的命令下载即可：

1
npm install <plugin-name> --save

安装完成之后，要在_config.yml里启用：

1
2
3
plugins:
- hexo-generator-feed
- hexo-generator-sitemap

配置博客托管项目地址，在_config.yml最后找到deploy，接下来的配置项就是了，下面是我的示例：

1
2
3
4
deploy:
  type: github
  repository: git@github.com:liangzhitao/liangzhitao.github.io.git
  branch: master

如果要绑定自定义域名的话，就需要新建一个CNAME文件放在根目录下的source文件夹下；这个目录就主要是放置博客内容的了；如果需要的话，可以建一个404页面，同样放在这个目录下，但是404页面需要顶级域名才支持，下面是腾讯的公益404页面代码。

1
2
3
4
5
6
7
8
9
10
<html>
<head>
<meta charset="UTF-8" />
<title>404</title>                                                                                                                                       
</head>
<body>
<h1>404 Page Not Found</h1>
<script type="text/javascript" src="http://www.qq.com/404/search_children.js" charset="utf-8"></script>
</body>
</html>

####生成博客
这样，Hexo就部署完成了，接下来就是生成博客了，博客的生成也很简单：

1
2
3
hexo clean
hexo g
hexo d                #这条命令自动把博客内容同步到github上去

Hexo使用的4000端口，生成之后，就可以本地查看调试了，浏览器打开http://$IP:4000查看效果。

###配置主题
我使用的主题是pacman，这里必须要要感谢Alimon同学的辛勤付出和无私奉献！主题介绍，猛戳这里，说的都比较详细了，我只大概介绍功能和Alimon没有提到的部分吧。

在主题配置里需要修改的主要有以下几个方面：

  • menu #配置页面
  • widgets #添加插件
  • rss #添加rss页面
  • duoshuo #开启多说评论

配置在博客主页显示新浪微博：

  1. 在微博秀页面获取微博秀代码；
  2. 在themes/pacman/layout/_widget目录下新建weibo.ejs文件，并将刚才获取的代码粘贴进去；
  3. 修改themes/pacman目录下的_config.yml文件，添加以下代码：
    1
    2
    widgets:
    - weibo

添加多说评论

注册多说，获取多说评论代码；将下面的代码粘贴到themes/pacman/layout/_partial/post/comment.ejs里；

1
2
3
4
5
<% if (theme.duoshuo.enable && page.comments){ %>
<section class="comment">
        <div class="ds-thread"></div>
</section>
<% } %>

修改themes/pacman/layout/_partial/post/article.ejs，找到

1
<%- partial('comment') %>

修改为

1
2
3
<% if (!index) { %>
  <%- partial('comment') %>
<% } %>

修改主题配置文件themes/pacman/_config.yml：

1
2
3
duoshuo:
  enable: enable  
  short_name: ailurus           #duoshuo short name

导航栏添加关于页面

1
hexo new page "about"

将想要添加的内容写进source/about/index.md里；

将themes/pacman/_config.yml相关内容修改如下：

1
2
3
4
menu:
  Home: /
  Archives: /archives
  About: /about

要写新文章，只需一个命令：

1
hexo new "my new post"

格式如下：

1
2
3
4
5
title: 开始使用Hexo写博客
date: 2014-01-29 15:43:10
tags:
categories:
---

这样，基于Hexo的博客就完成了！

PS：Markdown是很漂亮，可是写起来感觉好累啊……