本站基于 Hexo + Butterfly 主题。日常改外观、改个人信息，主要动两个文件：

文件 作用
_config.yml Hexo 站点级配置（站名、作者、语言、部署等）
_config.butterfly.yml Butterfly 主题配置（头像、背景、菜单、侧边栏等）

改完后执行 hexo clean && hexo g && hexo d 部署即可生效。

一、站点基本信息

编辑 _config.yml 顶部的 Site 段：

1
2
3
4
5
6
7
title: Zenty's Blog     # 站点标题（浏览器标签页和首页大标题）
subtitle: ""            # 副标题
description: "Zenty 的个人技术博客，分享 Java 后端、Python 爬虫、AI Agent 开发的学习笔记与实践经验。"  # 站点描述（SEO 用）
keywords:               # 关键词
author: Zenty           # 站长名称（侧边栏卡片、页脚版权都读这里）
language: zh-CN
timezone: ""
  • title：浏览器标签页和首页大标题都读这里
  • description：搜索引擎抓取的站点描述，写一句话介绍即可
  • author：改一次，全站的作者署名、版权信息都会同步

二、头像

编辑 _config.butterfly.yml：

1
2
3
avatar:
  img: /img/avatar.png   # 头像图片路径
  effect: false          # 是否旋转，true 会一直转圈

图片放到 source/img/avatar.png（没有 img 文件夹就新建一个）。路径里的 /img/xxx 对应的就是 source/img/xxx。

支持 png / jpg / webp，建议用正方形图，否则会被裁切。

三、网站背景

背景在 _config.butterfly.yml 的 background 字段：

1
2
3
4
5
6
7
8
# 纯色
background: "#f5f5f5"

# 渐变
background: "linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%)"

# 图片背景
background: url(https://example.com/bg.jpg)

本站目前是 background: false，没有用这个字段。页面底色由自定义样式 source/css/minimal.css 里的 --canvas 变量控制（浅色模式 #f5f6f8，深色模式 #111318），想换底色改这两个值即可。想用渐变或图片背景，按上面的写法填 background。

四、顶部图（Top Img）

顶部图是每页面顶部那张大横图：

1
2
3
4
5
6
7
disable_top_img: false       # true 则全站关闭顶部图

default_top_img: /img/top-bg.webp   # 默认顶部图（没单独配的页面用它）
index_img: /img/top-bg.webp         # 首页顶部图
archive_img: /img/top-bg.webp       # 归档页顶部图
tag_img:                            # 标签页顶部图（留空用 default）
category_img:                       # 分类页顶部图（留空用 default）

图片放到 source/img/top-bg.webp（或你指定的路径）。

单篇文章也能单独配顶部图：在文章 front-matter 加 top_img: /img/xxx.jpg。

五、导航菜单

菜单在 _config.butterfly.yml 顶部：

1
2
3
4
5
6
7
menu:
  首页: / || fas fa-home
  归档: /archives/ || fas fa-archive
  标签: /tags/ || fas fa-tags
  分类: /categories/ || fas fa-folder-open
  书签: /links/ || fas fa-bookmark
  关于: /about/ || fas fa-heart

格式是 显示名: 路径 || 图标class。

  • 显示名：菜单上显示的文字
  • 路径：页面的 URL，比如 /tags/
  • 图标：FontAwesome 图标 class，去 fontawesome.com 搜，复制 class 名（如 fas fa-home）

新增菜单项后，记得用 hexo new page 页面名 建对应页面，否则点进去会 404。

六、社交链接

侧边栏的社交图标：

1
2
social:
  fab fa-github: https://github.com/Zenty-Me || Github || '#24292e'

格式是 图标class: 链接 || 悬停文字 || 颜色。想加多个就多写几行：

1
2
3
4
social:
  fab fa-github: https://github.com/Zenty-Me || Github || '#24292e'
  fas fa-envelope: mailto:me@example.com || Email || '#88c0d0'
  fab fa-weibo: https://weibo.com/yourid || 微博 || '#e6162d'

七、侧边栏作者卡片

侧边栏那个带头像和按钮的卡片：

1
2
3
4
5
6
7
8
card_author:
  enable: true
  description: 写代码，也写点别的   # 作者名下方的描述
  button:
    enable: true
    icon: fab fa-github
    text: Follow Me
    link: https://github.com/Zenty-Me

description 是作者名下面那一行小字，改成自己的签名即可。

八、Favicon（浏览器标签页小图标）

1
favicon: /img/favicon.png

图片放到 source/img/favicon.png。建议用 32×32 或 64×64 的 png，也可以用 ico 格式（写成 /img/favicon.ico）。

九、图片资源放哪

所有自定义图片（头像、顶部图、favicon、文章配图）都放在 source/img/ 目录下：

1
2
3
4
5
6
source/
  img/
    avatar.png        # 头像
    top-bg.webp       # 顶部图
    favicon.png       # 站点图标
    404.jpg           # 404 页配图

引用时路径写 /img/文件名。新增图片后不需要额外配置，直接部署即可。

十、图片灯箱（lightbox）

文章里的图片默认点击没反应。开启灯箱后，点击图片会放大居中显示，再点一下关闭，方便读者看细节图、截图。

在 _config.butterfly.yml 里：

1
lightbox: fancybox

一行搞定。Butterfly 自带 fancybox 支持，设成 fancybox 即启用，留空则关闭。本站当前已开启。

写文章时正常用 Markdown 图片语法 ![描述](图片地址) 即可，无需额外标记，所有文章内的图片都会自动获得点击放大效果。

十一、部署生效

任何配置改完后，三连部署：

1
hexo clean && hexo g && hexo d

等 30 秒到 2 分钟，访问 https://zenty-me.github.io/ 查看。GitHub Pages 有 CDN 缓存，看到旧内容就 Ctrl+F5 强刷或等一两分钟。

小结

想改什么 改哪里
站点名 / 作者名 / SEO 描述 _config.yml 的 title / author / description
头像 _config.butterfly.yml 的 avatar.img + 放图到 source/img/
背景色 / 渐变 _config.butterfly.yml 的 background；本站底色在 source/css/minimal.css 的 --canvas
顶部图 _config.butterfly.yml 的 default_top_img 等
导航菜单 _config.butterfly.yml 的 menu
社交图标 _config.butterfly.yml 的 social
作者签名 _config.butterfly.yml 的 card_author.description
图片点击放大 _config.butterfly.yml 的 lightbox: fancybox
标签页小图标 _config.butterfly.yml 的 favicon