Hexo搭建个人博客系列【七】（hexo博客部署）

这次我将讲解如何使用Hexo Butterfly主题。

0. 前期回顾

最新的Hexo+GitHubPages 搭建个人博客[1]

现代Hexo+GitHubPages 构建个人博客[2] – 使用Vercel 加速和自定义您的域名

最新Hexo+GitHubPages搭建你的个人博客[3]——使用GitHub提供的自定义域名】

最新Hexo+GitHubPages搭建个人博客[4] – Hexo的基本使用

最新Hexo+GitHubPages搭建个人博客[5]——使用主题Icarus

Hexo搭建个人博客系列[6]——使用NextT主题

1. 主题介绍

hexo-theme-butterfly 是基于Molunerfinn 的hexo-theme-melody 开发的，当前版本是v4.13.0。

主题官网：https://github.com/jerryc127/hexo-theme-butterfly

官网效果图：

2. 主题安装

2.1 下载主题

我们建议使用克隆最新版本的方法。后续更新可以通过git pull快速完成，无需再次下载压缩包。

切换到博客主题的根目录，打开Git Bash，然后运行以下命令：

git clone https://github.com/jerryc127/hexo-theme-butterfly.git 主题/butterfly

下载完成后，将在项目的主题目录中创建一个蝴蝶文件夹。

如果不需要更改代码，可以直接通过npm安装。

npm 我hexo 主题蝴蝶

仅支持Hexo 5.0.0 及以上版本

2.2 渲染器下载

您需要安装pug 和stylus 渲染器。如果不安装，启动后访问页面会报错。

错误：扩展include/layout.pug 块内容include ./includes/mixins/post-ui.pug #recent-posts.recent-posts +postUI include include/pagination.pug

npm 安装hexo-renderer-pug hexo-renderer-stylus –save

2.3 切换主题

启用所有Hexo 主题的模式相同。克隆/下载完成后，打开站点配置文件，找到主题字段，并将其值更改为“蝴蝶”。

主题:蝴蝶

至此，Butterfly主题安装完成。

2.4 验证主题

启动服务，访问http://localhost:4000查看效果。

hexo clean hexo s

3. 主题配置

主题配置文件为themes/butterfly/_config.yml。

3.1 配置说明

以下是themes/butterfly/_config.yml 文件的翻译版本。您可以复制该文件并替换原始文件。

# 导航栏设置（Navigation bar settings）
参见#https://butterfly.js.org/posts/4aa8abbe/##导航栏设置-Navigation-bar-settings。
#————————————————- ————
导航:
标志: #Image
display_title: 真
fix: false # 修复导航栏
# 菜单目录
菜单:
#Home:/|| 发发首页
# Archives: /archives/|| fas fa-archive
# Tags: /tags/|| 发发标签
# 类别: /类别/|| fas fa-文件夹-打开
# 列表||fas fa-list:
# Music: /音乐/|| 发发音乐
# Movie: /电影/|| 发发视频
# Link: /链接/||
# About: /about/|| 发发心
# 代码块（代码块相关）
#—————————————-
突出主题: Light # Dark/Pale night/Light/Sea/false
height_height_limit: false # 单位：像素
code_word_wrap: 假
# 突出显示工具栏
highlight_theme_macStyle: false # 使用Mac 风格
height_copy: true # 复制按钮
highlight_lang: true # 显示代码语言
height_shrink: false # true: 缩小代码块/false: 展开代码块none: 展开代码块以隐藏按钮
height_fullpage: true # true: 添加切换到全屏的按钮
# 社交设置（社交图标设置）
#官方:
# icon: 链接说明||
社交:
#fab fa-github: https://github.com/xxxxx

|| GitHub || \’#24292e\’

# fas fa-envelope: mailto: