hexo-your-blog

Category:
发表:
大纲
  1. 1. 正文开始
    1. 1.1. 环境要求
    2. 1.2. 基本介绍
    3. 1.3. hexo主题
    4. 1.4. hexo主题自定义修改
  2. 2.

我曾纠结在哪里写博客,使用过的blog产品有oschina, cnblog这些博客站,还有过自己搭建博客。前者因为都现有的blog站点上写博客,有着很多的条条框框,不是太舒服。后者,由于没有自己的空间(穷屌丝,买不起服务器空间),所以折腾完就丢了。

直到我看到了hexo,于是我喜欢上了这种使用markdown来写博客的方式,非常的爽。

hexo是一个基于nodejs的静态博客生成程序,作者tommy351

这是一篇介绍关于如何使用hexo搭建个人blog的教程。参考链接在此,文章版权归原作者所有。本blog参考了其中大部分内容。

更新:现在hexo已经升级到3.x.x版本,使用了core + plugin的设计思路,且代码使用promise风格重写了。所以本文的部分内容将不再使用hexo 3.x.x。

正文开始

环境要求

  • git
  • nodejs
  • hexo

git与nodejs的安装不再赘述,hexo的安装如下:

npm install hexo

基本介绍


hexo目前最新版是2.7(截至这篇文章的发布时间),虽然仍然有不少的bug,但是在github上的人气相当可以,我相信它会越做越好的。

这里是hexo的使用说明,下面是一些简明的使用:

hexo new [layout] "post_name"   // 新建一篇post
hexo generate                   // 生成静态文件
hexo deploy                     // 发布到托管网站上

hexo还比较人性化的提供了一些命令的缩写:

hexo n [layout] "post_name"
hexo g
hexo d

此外,generatedeloy操作还可以合并在一起:

hexo g -d

或者

hexo d -g

这里是一些命令的基本用法,下面只说一点关于hexo new的注意事项:

hexo new [layout] "post_name"

其中layout参数表示新建的post基于哪一种layout配置。那么,我们有哪些layout配置呢?默认带有了几种配置,见scaffolds文件夹。
你可以修改这些layout配置统一应用到新建post上。

你还可以在post中使用<!-- more -->来实现文章摘要的目的。如下:

我是摘要
<!-- more -->
我是正文

hexo主题

blog主题是一个很能体现个人特色的元素。话说萝卜青菜各有所爱,这里是hexo的theme列表,你可以尝试选择一款自己喜欢的theme应用到自己的blog上。

安装theme的方法:

  • 下载你喜欢的theme
  • 放在themes文件夹中
  • 修改hexo配置
theme: your_favourite_theme_name

如果你喜欢折腾,你还可以自定义属于自己的主题,一般来说,可以基于某一个现有的theme做一些修改。hexo的theme使用的是ejs模版。
使用hexo提供的Variables,在theme模版中作各种判断,就可以自定义自己的theme啦。

hexo主题自定义修改

下面是一个添加多说评论系统的例子。

我使用的是light主题,这个theme很淡雅,看起来还不错。
不过light默认使用的是disqus评论,可能在国内的速度不是很快,所以我最终选择了国产的多说。

  • 首先修改主题的配置_config.yml,添加你的duoshuo帐号名称

      duoshuo_shortname: gejiawen-blog
    
  • 然后修改相应的模版文件layout/_partial/commnet.ejs

说明

我这里使用的主题是light,可能你并没有使用这个主题,那么就不一定是修改这个comment.ejs文件,可能这个文件都不一定存在了。具体要怎么办,那就需要自己摸索主题的各个模版文件是做什么的了。

添加相关代码:(在这之前你需要在多说上获取自己的通用代码)

<% if (page.comments && theme.duoshuo_shortname){ %>

<%= __('comment') %>

<% } %>

一点解释

  • page.comments: 是用于判断当前页面是不是用于文章页面,即当处于首页或者归档这个页面时,这个条件是不满足的。
  • theme.duoshuo_shortname: 你在主题配置中设置的多说用户名。
  • <%= path %>: 将当前文章的path作为多说的thread-key,这个变量要求唯一,所以这里我用了path。