这里是我对 Hexo Buttery 进行设置的修改，与其他设置，仅供参考。

配置修改

修改菜单部分

1
2
3
4
5
6
7
8
9
10
menu:
  主页: / || fas fa-home
  分类: /categories/ || fas fa-archive
  标签: /tags/ || fas fa-tag
  关于: /about/ || fas fa-user
  友情链接: /link/ || fas fa-link
  语言|| fas fa-language:
    English: /en/ || fas fa-e
    中文: / || fas fa-c
    日本語: /ja/ || fas fa-j

允许代码块全屏

1
2
code_blocks:
  fullpage: true

修改个人图片

1
2
3
4
5
favicon: /img/favicon.png

avatar:
  img: /img/avatar.png
  effect: false

设置 TOC 自动展开

1
2
3
toc:
  # expand: false
  expand: true

开启搜索

1
pnpm install hexo-generator-searchdb
1
2
search:
  use: local_search

开启评论

1
2
3
4
5
6
comments:
  use: artalk

twikoo:
# artalk 的设置
# ...

note 块不要圆角

1
2
note:
 border_radius: 0

开启图片灯箱

1
lightbox: fancybox

引入自定义 CSS

创建自定义样式文件 source/css/custom.styl，填入以下内容：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/* note 块，代码块， tab 块 不要圆角 */ 
.container .tabs {
  border-radius: 0!important;
}

.container figure.highlight {
  border-radius: 0!important;
}

blockquote {
  border-radius: 0!important;
}

/* 给文章内的图片给图片加个边框 */
p > a > img {
  border: 1px solid #eee; /* 1px 灰色边框 */
  padding: 2px;           /* 图片内边距为 2px */
  box-sizing: border-box; /* 保证边框和内边距不影响图片尺寸 */
}

在主题配置文件 _config.butterfly.yml 的 inject > head 引入样式：

1
2
3
4
5
# Inject
# Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag)
inject:
  head:
    - <link rel="stylesheet" href="/css/custom.css">

.styl 会被 Hexo 渲染成 .css 文件，所以此处应为 custom.css 。