hexo+github page搭建博客

环境安装

在windows和linux下都配置了,感觉还是Linux方便一点

node.js环境(windows,linux略)

官方下载地址,选择对应版本,改个安装路径,然后一路下一步。

安装完成可以在windows命令行,查看是否安装成功。

1
2
node -v
npm -v

git环境

略

配置github

https://github.com/

新建repository

点击New repository

Repository name下填写博客目录,例如:username.github.io
Description下填写描述,例如:我的博客

生成github page

创建目录后进入该目录,“Setting”进行设置。

下拉到“GitHub Pages”模块,点击“Launch automatic page generator”按钮,生成github page。

刚才配置的“username.github.io”已经可以访问了。

Hexo

linux的cd很简单,但是windows有点坑爹,中间加一个/d。

通过cmd命令行窗口进入到想要安装的目录。当然也可以通过文件系统进入当该目录,shift+右键点进去。

1
cd /d D:\coding files\Workspace\hexo

然后执行安装命令

1
npm install hexo-cli -g

等待比较久之后安装完了,会有WARN,但没事,查看是否成功

1
hexo -v

初始化。

1
2
3
4
hexo init #不加路径表示当前文件夹作为hexo目录
npm install
hexo generate #生成静态文件,从source/_post目录将md转成public中的html
hexo server #启动本地server,端口4000

到这里已经可以在本地访问到了,http://localhost:4000

配置文件

修改配置文件:_config.yml。主要配置网站url、deploy到github的地址。每个冒号后面一定要有空格。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# Site
title: 小懒的博客
subtitle:
description:Re0: 从零开始的程序猿世界
author: 小懒
language: zh-Hans
timezone: Asia/Shanghai
# URL
url: https://fangyeqing.github.io/
root: /
# Deployment
deploy:
type: git
repo: https://github.com/fangyeqing/fangyeqing.github.io.git
branch: master

部署到github page

部署之前安装一下hexo-git部署插件

1
npm install hexo-deployer-git --save

部署加-g参数表示部署之前执行生成静态文件操作,相当于

1
hexo deploy -g

出现问题

1
Username for 'https://github.com': error: unable to read askpass response from '/usr/libexec/openssh/gnome-ssh-askpass'

执行如下指令,或者直接把它加入到.bash_profile中

1
unset SSH_ASKPASS

添加新文章

source/_post文件夹: 新建md类型的文档,新建的文章头需要添加一些信息,比如标题、日期、分类、标签等,如下所示:

1
2
3
4
5
6
7
---
title: Hello World
date: 2015-12-03 00:00:00
categories: samza
tags: [samza,学习,hello world]
toc: true
---

categories:分类
toc:设定是否开启目录,需要主题支持。

可以现在本地测试一下,确认没问题再deploy上去

1
2
hexo g
hexo s

重新发布

1
hexo d -g

主题修改

去hexo的github下载主题,放到themes目录下

1
git clone https://github.com/MOxFIVE/hexo-theme-yelee.git themes/yelee

然后根据作者的gitbook修改_config.yml文件,实现各种配置,改完继续重新发布出去

其中比较重要的如下,其他的个性化定制可以去作者的gitbook:

评论系统

可以利用多说或者有言。

先去多说注册一个账号,创建站点。例如我注册的为:fangyeqing.duoshuo.com,在配置disqus中反注释掉duoshuo的on: true,然后在domain 中填入你设定的域名前半部分。

1
2
3
duoshuo:
on: true
domain: fangyeqing

站内搜索

需要先安装一个插件

1
npm install hexo-generator-search --save

然后修改配置文件

1
2
3
4
5
6
7
8
9
#主题配置themes/yelee/_config.yml
search:
on: true
onload: false
#根目录配置_config.yml
search:
path: search.xml
field: all

文章摘要

在首页显示摘要,非全文。在文章头部加入以下内容:

1
2
3
4
5
6
7
8
9
10
11
12
---
title: Hello World
date: 2015-12-03 00:00:00
categories: samza
tags: [samza,学习,hello world]
toc: true
---
<Excerpt in index | 首页摘要>
摘要内容...
<!-- more -->
<The rest of contents | 余下全文>
余下的全文内容...

关于我

1
hexo new page about

在hexo\source\about\index.md中修改

标签云

1
hexo new page tags

会自动生成标签云

遇到问题

在发布博客的时候遇到的一个问题

1
2
3
Template render error: (unknown path) [Line 31, Column 31]
```
Hexo使用 Nunjucks 来解析文章(旧版本使用 Swig,两者语法类似),内容若包含两层大括号{ {或 { % % } 可能导致解析错误,您可以用 raw 标签包裹来避免潜在问题发生。或者在两个大括号之间加入空格{ {

Hello {{ sensitive }}

```
其他的问题:参加官网:问题解答

文章目录
  1. 1. 环境安装
    1. 1.1. node.js环境(windows,linux略)
    2. 1.2. git环境
  2. 2. 配置github
    1. 2.1. 新建repository
    2. 2.2. 生成github page
  3. 3. Hexo
    1. 3.1. 配置文件
  4. 4. 部署到github page
    1. 4.1. 出现问题
  5. 5. 添加新文章
  6. 6. 主题修改
    1. 6.1. 评论系统
    2. 6.2. 站内搜索
    3. 6.3. 文章摘要
    4. 6.4. 关于我
    5. 6.5. 标签云
  7. 7. 遇到问题
|