hexo之使用记录

Posted on

此博客使用了Hexo.

使用过程

安装hexo

首先需要保证你已经安装了node.js, 和git, 并且命令行使用有效.

1
$ npm install hexo-cli -g

新建一个博客

1
$ hexo init your_blog_name

启动hexo的服务器,用于本机查看效果

1
2
3
$ hexo server
# 或者
$ hexo s

启动后打开浏览器, 在地址栏输入: http://127.0.0.1:4000 就可以查看效果.

部署

部署到github page上面

修改配置文件

1
2
3
deploy:
  type: git
  repo: git@github.com:hello/hello.github.io.git

注意: git@github.com:hello/hello.github.io.git 应该修改为你的github page地址.

部署

1
$ hexo deploy

注:此时可能部署失败,说没有git类型,此时请继续往下看!

安装github上传插件

1
$ npm install hexo-deployer-git --save

注:安装了此插件后, 再运行: hexo deploy, 就会成功了!

新建文章

新建直接要发布的文章

1
$ hexo new "blog_name"

新建完之后就会在source/_posts下面生成新的文章,你就可以打开进行编辑.

新建不发布的草稿

由于你可能在一篇文章还没写好之前是不会发布的,所以这时候就需要草稿了,具体操作步骤如下:

1
$ hexo new draft "draft_test"

新建完之后会在source/_drafts下面新建draft_test.md的文件,这就是你需要开始编辑的新文档, 如果编辑完后需要发布,请进行如下操作:

1
$ hexo publish draft draft_test

进行完上面的步骤, 就会将draft_test.md移动到source/_posts文件夹下面.

生成要发布的内容

1
2
$ hexo clean
$ hexo generate

发布内容(部署)

1
$ hexo deploy

文章内使用图片

需要的插件

1
$ npm install hexo-asset-image --save

配置文件的修改

1
post_asset_folder: true

创建需要使用图片的文章

1
$ hexo new "image_test"

图片地址的确定

在_posts目录下新建 image_test 文件夹, 然后放入使用的图片 image_01.png.

图片使用

在 image_test.md文章中插入 ![](image_test/image_01.png).

目录结构图

1
2
3
4
5
6
7
8
source
  |
  |- _posts
  |   |
  |   |- image_test
  |   |    |
  |   |    |- image_01.png
  |   |- image_test.md

文章内引用其他文章

1
2
3
4
{% post_link 文章文件名（不要后缀） 文章标题（可选） %}

如要用git_learn时：
{% post_link git_learn 学习使用git %}

tags配置

在有的主题中, 有tags, 即标签页页面,具体配置过程如下:

1
$ hexo new page "tags"

进行了上面步骤后, 会在source下面生成tags文件夹, 并且有一个index.md文件,修改文件如下:

1
2
3
4
5
---
title: tags
date: 2016-05-21 12:51:53
type: "tags"
---

总的目录结构图

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
your_blog_name
  |
  |-<Other Directory>
  |
  |-source
  |   |- _posts
  |   |   |
  |   |   |- image_test
  |   |   |    |
  |   |   |    |- image_01.png
  |   |   |- image_test.md
  |   |
  |   |- tags
  |   |   |-index.md
  |
  |-themes
  |   |- themename
  |   |     |-_config.yml(主题配置文件)
  |
  |- _config.yml(站点配置文件)
  |
  |-<Other File>

`

主题配置

使用Next主题

使用参考地址

注意点:

  • 站点配置文件: 博客根目录下的_config.yml文件
  • 主题配置文件: themes/themename 下面的_config.yml文件

其他主题