3-hexo使用说明

置顶 工具 hexo 3-hexo
发布时间 :
字数:1.5k 阅读 :
  1. 一、初始化博客下 _config.yml
    1. 1.1 国际化
    2. 1.2 关掉 hexo 自带的代码高亮
  2. 二、功能相关
    1. 2.1 自定义首页
    2. 2.2 blog快捷键
    3. 2.3 多作者模式
    4. 2.4 开启关于页面
    5. 2.5 添加音乐插件
    6. 2.6 配置评论系统
  3. 三、样式设置
    1. 3.1 代码高亮
  4. 3.2 MathJax数学公式
    1. 3.3 表格样式
    2. 3.4 文章列表的hover样式
    3. 3.5 开启字数统计
    4. 3.6 更换头像
  5. 四、排序及置顶
    1. 4.1 分类排序
    2. 4.2 文章排序
  6. 五、关于写文章
    1. 5.1 如何写
    2. 5.2 写作
  • 下面如果没有特殊说明，_config.yml都指主题配置文件，即3-hexo目录下

一、初始化博客下 _config.yml

1.1 国际化

1
language: zh-CN #支持 zh-CN、en

1.2 关掉 hexo 自带的代码高亮

主题内置了主题高亮，所以需要禁用 hexo 自带的高亮

1
2
highlight:
    enable: false

二、功能相关

2.1 自定义首页

可查看这篇文章： 3-hexo配置首页(3-hexo原作者的文章)

2.2 blog快捷键

可查看这篇文章： 3-hexo快捷键说明(3-hexo原作者的文章)

2.3 多作者模式

可查看这篇文章： 3-hexo多作者模式(3-hexo原作者的文章)

2.4 开启关于页面

1.在hexo根目录执行以下，创建关于页面

1
hexo new page "about"

2.位置：source/aoubt/index.md，根据需要进行编辑。

3.在主题中开启显示：修改主题根目录_config.yml中的about的on为true，如下所示

yaml
1
2
3
4
5
menu:
about:  # '关于' 按钮
 on: true # 是否显示
 url: /about  # 跳转链接
 type: 1 # 跳转类型 1：站内异步跳转 2：当前页面跳转 3：打开新的tab页

2.5 添加音乐插件

3-hexo 添加音乐插件(3-hexo原作者的文章)

2.6 配置评论系统

3-hexo评论设置(3-hexo原作者的文章)

三、样式设置

3.1 代码高亮

首先要关闭hexo根目录下_config.yml中的高亮设置：

1
2
highlight:
  enable: false

配置主题下_config.yml中的高亮设置：

可以根据提示，配置喜欢的高亮主题

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
highlight:
  on: true # true开启代码高亮
  lineNum: true # true显示行号
  theme: darcula
# 代码高亮主题,效果可以查看 https://highlightjs.org/static/demo/
# 支持主题：
# sublime : 参考sublime的高亮主题
# darcula : 参考idea中的darcula的主题
# atom-dark : 参考Atom的dark主题
# atom-light : 参考Atom的light主题
# github : 参考GitHub版的高亮主题
# github-gist : GitHub-Gist主题
# brown-paper : 牛皮纸效果
# gruvbox-light : gruvbox的light主题
# gruvbox-dark ： gruvbox的dark主题
# rainbow :
# railscasts :
# sunburst :
# kimbie-dark :
# kimbie-light :
# school-book : 纸张效果

3.2 MathJax数学公式

修改_config.yml

1
2
3
4
# MathJax 数学公式支持
mathjax:
  on: true #是否启用
  per_page: false # 若只渲染单个页面，此选项设为false，页面内加入 mathjax: true

考虑到页面的加载速度，支持渲染单个页面。

设置per_page: false,在需要渲染的页面内加入mathjax: true

  • 注意:
  • 由于hexo的MarkDown渲染器与MathJax有冲突，可能会造成矩阵等使用不正常。所以在使用之前需要修改两个地方
  • 编辑node_modules\marked\lib\marked.js脚本

1.将451行 ，这一步取消了对\\,\{,\}的转义(escape)

1
2
3
escape: /^\\([\\`*{}\[\]()# +\-.!_>])/,
改为
escape: /^\\([`*\[\]()# +\-.!_>])/,

2.将459行，这一步取消了对斜体标记_的转义

1
2
3
em: /^\b_((?:[^_]|__)+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
改为
em:/^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,

3.3 表格样式

目前提供了3中样式，修改_config.yml

1
2
3
4
5
table: green_title
# table 的样式
# 为空时类似github的table样式
# green 绿色样式
# green_title 头部为青色的table样式

3.4 文章列表的hover样式

鼠标移入的背景色和文字颜色变动，设置_config.yml

1
2
3
4
5
6
7

#文章列表 鼠标移上去的样式, 为空时使用默认效果
article_list:
  hover:
    background: '#e2e0e0'  # 背景色:提供几种：'#c1bfc1'  '#fbf4a8'
    color:     # 文字颜色 提供几种：'#ffffff'
# 注意：由于颜色如果包含#，使用单引号 ' 引起来

3.5 开启字数统计

1.开启此功能需先安装插件，在 hexo根目录 执行npm i hexo-wordcount --save

2.修改_config.yml

1
word_count: true

3.6 更换头像

两种方式:

1.替换source/img/avatar.jpg图片

2.修改_config.yml中头像的配置记录

1
2
3
# 你的头像url
avatar: /img/avatar.jpg
favicon: /img/avatar.jpg

#3.7 设置链接图标

如下，如果没有连接，则不展示图标。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

#链接图标，链接为空则不显示
link:
  rss: /atom.xml
    github: https://github.com/XU-Zijin
    #facebook:
    #twitter:
    #linkedin:
    #instagram:
    #reddit:
    weibo: https://weibo.com/u/7766478877
    jianshu: https://www.jianshu.com/u/fc16bd10b165?order_by=shared_at
    zhihu: https://www.zhihu.com/people/xzj-zh
    csdn: https://blog.csdn.net/apple_71925917?spm=1000.2115.3001.5343
    oschina: https://www.oschina.net/
    #juejin:
    email: 3279388083@qq.com
    qq: 3279388083
    kugou: https://www.kugou.com/
    #neteasemusic:
    gitee: https://gitee.com/xzj0512

四、排序及置顶

4.1 分类排序

默认按照首字母正序排序，由于中文在nodejs环境下不能按照拼音首字母排序，所以添加了自定义排序方式，在主题下_config.yml中找到如下配置，category.sort则是定义分类顺序的。

规则：在sort中定义的category比没有在sort中定义的更靠前

1
2
3
4
5
6
7
8
9
10
11
# 文章分类设置
category:
  num: true # 分类显示文章数
  sub: true # 开启多级分类
  sort:
    - 读书
    - 大前端
    - 后端
    - 数据库
    - 工具
    - 运维

4.2 文章排序

文章列表默认按照创建时间（如下文章内定义的date）倒序。

使用 top 将会置顶文章，多个置顶文章时top定义的值越大，越靠前。

1
2
3
4
5
6
7
8
9
---
title: 3-hexo使用说明
date: 2023-03-26 12:11:27
top: 1
categories:
- 工具
tags:
- hexo
- 3-hexo

五、关于写文章

5.1 如何写

每篇文章最好写上文集和标签，方便筛选和查看。

一般推荐一篇文章设置一个文集，一个或多个标签

categories:文集，为左侧列表

tags:标签，通过#来筛选

例如 本篇文章的设置

1
2
3
4
5
6
7
8
9
---
title: 3-hexo使用说明
date: 2023-03-26 12:11:27
top: 1
categories:
- 工具
tags:
- hexo
- 3-hexo

5.2 写作

1.设置模板，blog根目录scaffolds/post.md

加入categories,tags等，这样以后通过hexo new生成的模板就不用写这两个单词了。

当然，你也可以写入任何你每个文章中都会有的部分。

1
2
3
4
5
6
---
title: {{ title }}
date: {{ date }}
categories:
tags:
---

这样，用hexo new <title>后生成的makedown(.md)文件里面的默认内容就是这样了。

本站支持IPv6访问

转载请注明来源，欢迎对文章中的引用来源进行考证，欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论，也可以邮件至 [email protected]

文章标题:3-hexo使用说明

字数:1.5k

本文作者:许子晋

发布时间:2023-03-26, 12:11:27

最后更新:2025-06-08, 13:09:21

原始链接:https://xuzijin.com/2023/03/26/3-hexo%E4%BD%BF%E7%94%A8%E8%AF%B4%E6%98%8E/

版权声明: "署名-非商用-相同方式共享 4.0" 转载请保留原文链接及作者。

©2019-2024 XuZijin

Built with Hexo and 3-hexo theme