0%

围炉志

之前使用过一些博客站来写些东西,但恒心难久,一段时间后,索性连站点位置也忘了,也使用过wordpress之内的博客模版,来搭建个人站点,后来托管服务器到期,数据迁出太困难,也曾遗失了不少数据,折腾起来太耗心力,也未坚持下去,渐渐的记录行为,转移到wiz上。技术的成长,往往需要相互的切磋,wiz实在难以满足开放及分享,删繁就简,这里干脆就使用hexo静态服务框架,做一个个人站点,既能实现备份同步,也方便书写互动,以做围炉,邀酒共谈。

以下是hexo站点搭建过程。

nodejs 安装

下载nodejs安装包,解压到指定目录,在PATH环境变量中添加解压目录的bin子目录
子目录中包含node启动命令,npm包管理命令。
如果环境中包含g++编译器,可考虑自行编译。

hexo 安装及初始化

1.安装

1
2
$ sudo yum install git-core
$ npm install -g hexo-cli

2.初始化

1
2
3
4
$ hexo init blog
$ cd blog
$ npm install
$ hexo server -p 8888

3.更改语言和时区

1
2
language: zh-Hans
timezone: Asia/Chongqing

RSS订阅功能

1.安装搜索插件

1
$ npm install hexo-generator-feed --save

2.配置站点目录下的_config.xml

1
2
3
4
5
6
7
8
9
10
plugin:
hexo-generator-feed
feed:
type: rss2
path: rss2.xml
limit: 20
hub:
content: true
content_limit: 140
content_limit_delim: ' '

使用next主题

安装next

移动到站点根目录

1
$ git clone https://github.com/iissnan/hexo-theme-next themes/next

在站点配置文件_config.yml中,将theme更改为next

1
theme: next

定制next

1. 增加站内搜索功能

安装搜索插件

1
$ npm install hexo-generator-searchdb --save

配置next中_config.xml

1
2
3
4
5
# Local search
local_search:
enable: true
trigger: auto
top_n_per_article: 1

2. 增加访问统计

为Next主题添加文章阅读量统计功能

注:使用中发现如果打开leancloud web安全域名,则文章访问量总统计无法上报,需进行权衡,或者使用别的插件如卜算子。

3.评论功能

~~ 使用gitment创建评论功能

为NexT主题添加文章阅读量统计功能

~~ 在theme/next/layout/_partials/comments.swig中,将gitment主题中的container的lang设置为”zh-CN”来使用中文环境。

next 5.1.3中已经添加了对gitment的支持

1
$ npm install gitment --save

然后在github生成你的application key,将相应的信息填入next配置文件中

1
2
3
4
5
6
7
8
9
10
gitment:
enable: true
count: true
lazy: false # 是否直接显示评论区
cleanly: false # 是否显示技术支持标签
language: # gitment插件语言设置,默认与站点配置语言相同
github_user: # github帐号
github_repo: # 评论的repo
client_id: # Github client id for the Gitment
client_secret: # Github secret key

4. 增加分享

1
jiathis: true

启用文档图片压缩

优化Hexo博客 - 压缩 HTML、CSS、JS、IMG 等

注:压缩过程中出现libpng12.so.0,安装libpng12

增加公式支持

1
$ npm install hexo-math --save

更改站点配置,增加

1
2
3
4
5
6
math:
engine: 'mathjax' # or 'katex'
mathjax:
# src: custom_mathjax_source
config:
# MathJax config

更改主体配置文件,修改

1
2
3
4
5
# MathJax Support
mathjax:
enable: true
per_page: false
cdn: //cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML

需要注意的是,使用公式过程中,”_“可能与html元素冲突,如果公式不能正确显示,需要在公式内将”_“进行转义为”\_“。

hexo博文路径优化

安装hexo-abbrlink

1
$ npm install hexo-abbrlink --save

更改站点配置

1
2
3
4
permalink: archives/:abbrlink.html
abbrlink:
alg: crc32 # 算法:crc16(default) and crc32
rep: hex # 进制:dec(default) and hex

使用git建立文档仓库

安装hexo-deployer-git

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

搭建git服务器

搭建git服务器

修改站点配置文件

1
2
3
4
5
deploy:
type: git
repo: <repository url>
branch: [branch]
message: [message]