初始化项目后,blog-hexo有如下结构:
【node_modules】:依赖包
【scaffolds】:生成文章的一些模板
【source】:用来存放你的文章
【themes】:主题
【.npmignore】:发布时忽略的文件(可忽略)
【_config.landscape.yml】:主题的配置文件
【_config.yml】:博客的配置文件
【package.json】:项目名称、描述、版本、运行和开发等信息

在blog-hexo目录下的_config.yml,就是整个Hexo框架的配置文件了。可以在里面修改大部分的配置。详细可参考官方的配置描述

hexo server或者hexo s
启动本地服务器。默认情况下,访问网址为: http://localhost:4000/

修改好配置后,运行如下命令,将代码部署到 GitHub。

1
2
3
hexo clean
hexo generate
hexo deploy

hexo clean:删除之前生成的文件,若未生成过静态文件,可忽略此命令。
hexo generate:生成静态文章,可以用hexo g缩写
hexo deploy:部署文章,可以用hexo d缩写

Hexo会自动合併主题中的_config.yml和 _config.butterfly.yml里的配置,如果存在同名配置,会使用_config.butterfly.yml的配置,其优先度较高。

Front-matter
Front-matter 是 markdown 文件最上方以—分隔的区域,用于指定个别档案的变数。

Page Front-matter 用于页面配置
Post Front-matter 用于文章页配置

Front-matter
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
---
title:
date:
updated:
type:
comments:
description:
keywords:
top_img:
mathjax:
katex:
aside:
aplayer:
highlight_shrink:
---

写法 解释
title 【必需】页面标题
date 【必需】页面创建日期
type 【必需】标签、分类和友情链接三个页面需要配置
updated 【可选】页面更新日期
description 【可选】页面描述
keywords 【可选】页面关键字
comments 【可选】显示页面评论模块(默认 true)
top_img 【可选】页面顶部图片
mathjax 【可选】显示mathjax(当设置mathjax的per_page: false时,才需要配置,默认 false)
katex 【可选】显示katex(当设置katex的per_page: false时,才需要配置,默认 false)
aside 【可选】显示侧边栏 (默认 true)
aplayer 【可选】在需要的页面加载aplayer的js和css,请参考文章下面的音乐 配置
highlight_shrink 【可选】配置代码框是否展开(true/false)(默认为设置中highlight_shrink的配置)

Front-matter
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
---
title:
date:
updated:
tags:
categories:
keywords:
description:
top_img:
comments:
cover:
toc:
toc_number:
toc_style_simple:
copyright:
copyright_author:
copyright_author_href:
copyright_url:
copyright_info:
mathjax:
katex:
aplayer:
highlight_shrink:
aside:
---

写法 解释
title 【必需】文章标题
date 【必需】文章创建日期
updated 【可选】文章更新日期
tags 【可选】文章标籤
categories 【可选】文章分类
keywords 【可选】文章关键字
description 【可选】文章描述
top_img 【可选】文章顶部图片
cover 【可选】文章缩略图(如果没有设置top_img,文章页顶部将显示缩略图,可设为false/图片地址/留空)
comments 【可选】显示文章评论模块(默认 true)
toc 【可选】显示文章TOC(默认为设置中toc的enable配置)
toc_number 【可选】显示toc_number(默认为设置中toc的number配置)
toc_style_simple 【可选】显示 toc 简洁模式
copyright 【可选】显示文章版权模块(默认为设置中post_copyright的enable配置)
copyright_author 【可选】文章版权模块的文章作者
copyright_author_href 【可选】文章版权模块的文章作者链接
copyright_url 【可选】文章版权模块的文章连结链接
copyright_info 【可选】文章版权模块的版权声明文字
mathjax 【可选】显示mathjax(当设置mathjax的per_page: false时,才需要配置,默认 false)
katex 【可选】显示katex(当设置katex的per_page: false时,才需要配置,默认 false)
aplayer 【可选】在需要的页面加载aplayer的js和css,请参考文章下面的音乐 配置
highlight_shrink 【可选】配置代码框是否展开(true/false)(默认为设置中highlight_shrink的配置)
aside 【可选】显示侧边栏 (默认 true)

标签页tags:
分类页categories:
友情链接links:

修改站点配置文件_config.yml,路径为【BlogRoot/_config.yml】。

修改主题配置文件_config.butterfly.yml,路径为【BlogRoot/_config.butterfly.yml】。

语言
修改站点配置文件_config.yml,默认语言是 en 。

主题支持三种语言:

default(en)
zh-CN (简体中文)
zh-TW (繁体中文)

网站资料
修改网站各种资料,例如标题、副标题和邮箱等个人资料,请修改站点配置文件_config.yml。部分参数如下,详细参数可参考官方的配置描述

参数 描述
title 网站标题
subtitle 描述
description 网站描述
keywords 网站的关键词。支持多个关键词。
author 您的名字
language 网站使用的语言。对于简体中文用户来说,使用不同的主题可能需要设置成不同的值,请参考你的主题的文档自行设置,常见的有 zh-Hans和 zh-CN。
timezone 网站时区。Hexo 默认使用您电脑的时区。请参考 时区列表 进行设置,如 America/New_York, Japan, 和 UTC 。一般的,对于中国大陆地区可以使用 Asia/Shanghai。

导航菜单
修改主题配置文件_config.butterfly.yml。

导航栏设置
修改主题配置文件_config.butterfly.yml。

1
2
3
4
nav:
logo: #image
display_title: true
fixed: false # fixed navigation bar

参数 解释
logo 网站的 logo,支持图片,直接填入图片链接
display_title 是否显示网站标题,填写 true 或者 false
fixed 是否固定状态栏,填写 true 或者 false

代码

代码高亮主题
Butterfly支持 6 种代码高亮样式:

darker
pale night
light
ocean
mac
mac light
修改主题配置文件_config.butterfly.yml。中的highlight_theme属性。

代码复制
修改主题配置文件_config.butterfly.yml。中的highlight_copy属性。

1
highlight_copy: true

代码框展开/关闭
修改主题配置文件_config.butterfly.yml。中的highlight_shrink属性。

1
highlight_shrink: true #代码框不展开,需点击 '>' 打开

在默认情况下,代码框自动展开,可设置是否所有代码框都关闭状态,点击>可展开代码。

true 全部代码框不展开,需点击>打开
false 代码框展开,有>点击按钮
none 不显示>按钮

代码换行
在默认情况下,Hexo 在编译的时候不会实现代码自动换行。如果你不希望在代码块的区域里有横向滚动条的话,那么你可以考虑开启这个功能。

修改主题配置文件_config.butterfly.yml。中的code_word_wrap属性。

1
code_word_wrap: true

代码高度限制
可配置代码高度限制,超出的部分会隐藏,并显示展开按钮。

1
highlight_height_limit: false # unit: px

注意:

单位是px,直接添加数字,如 200
实际限制高度为highlight_height_limit + 30 px ,多增加 30px 限制,目的是避免代码高度只超出highlight_height_limit 一点时,出现展开按钮,展开没内容。
不适用于隐藏后的代码块( css 设置 display: none)。