2019-08-08 3 分钟读完 (大约 415 个字)

hexo 博客搭建

安装

node

node -v
npm -v

git

git version

github

个人仓库
username.github.io

hexo

1 2	npm install -g hexo-cli hexo version

创建

网站

1
2
3

hexo init blog
cd blog
npm install

文章

1	hexo new '文章标题'

执行完成后可以在 /source/_posts 下看到一个“文章标题.md”的文章文件

启动服务

启动前先编译生成静态文件

hexo g

hexo s

默认访问地址：http://localhost:4000

部署

hexo 博客部署

访问

网站链接

域名绑定

TODO

扩展

主题修改

下载主题文件到主目录：

1 2	cd your-hexo-site git clone https://github.com/iissnan/hexo-theme-next themes/next

修改主目录下的_config.yml，指向自定义的主题：

1	theme: {#theme-title}

theme-title: 自定义主题的名称

主题定制

字体修改：主题source文件夹下css目录
示例：

1	family-sans = "Open Sans", "Helvetica Neue", "Microsoft YaHei", sans-serif

内容区宽度, 修改layout.ejs文件中的

1	is-8-tablet is-8-desktop is-8-widescreen

为

1	is-9-tablet is-9-desktop is-9-widescreen

同时，修改widget.ejs文件

参考：
Bulma
CSS 框架 Bulma 教程

文章内链

1	{% post_link post-title-sample 点此查看 %}

post-title-sample - 文章名称，如果文章不存在，这段代码将会被直接忽略。
点此查看 - 链接标题。如果置空，则自动提取文章的标题。

文章标签

遵循yaml文件格式

1 2	tags：tag-name tags: [tag-name1, tag-name2]

参考：http://www.ruanyifeng.com/blog/2016/07/yaml.html

插件

代码着色

https://github.com/highlightjs/highlight.js
https://highlightjs.org/
推荐样式：monokai-sublime

实时预览

BrowserSync plugin for Hexo.

1	npm install hexo-browsersync --save

自动摘要

1	npm install hexo-excerpt --save

# Hexo