博客魔改教程总结(四)
魔改前必看（太细节的就不写在教程中了，我也不会🤣🤣🤣）
博客魔改有风险，如果博客魔改出问题了又没有备份，可通过此项目查看基础源码进行回滚：jerryc127/hexo-theme-butterfly、ccknbc-actions/blog-butterfly。
这部分魔改基本上都是大佬们造好的轮子，我按照大佬们的轮子结合自己的喜好进行魔改的。
鉴于每个人的根目录名称都不一样，本帖博客根目录一律以[BlogRoot]指代。
本帖涉及魔改源码的内容，会使用diff代码块标识，复制时请不要忘记删除前面的+、-符号。
因为.pug和.styl以及.yml等对缩进要求较为严格，请尽量不要使用记事本等无法提供语法高亮的文本编辑器进行修改。
本帖基于Butterfly主题进行魔改方案编写，因此请读者优先掌握Butterfly主题官方文档的内容后再来进行魔改。
魔改会过程常常引入自定义的css与js文件，方法见Hexo博客添加自定义css和js文件(太懒了不想自己写)
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一)
博客搭建基础教程(二)
博客搭建 ...
博客魔改教程总结(三)
魔改前必看（太细节的就不写在教程中了，我也不会🤣🤣🤣）
博客魔改有风险，如果博客魔改出问题了又没有备份，可通过此项目查看基础源码进行回滚：jerryc127/hexo-theme-butterfly、ccknbc-actions/blog-butterfly。
这部分魔改基本上都是大佬们造好的轮子，我按照大佬们的轮子结合自己的喜好进行魔改的。
鉴于每个人的根目录名称都不一样，本帖博客根目录一律以[BlogRoot]指代。
本帖涉及魔改源码的内容，会使用diff代码块标识，复制时请不要忘记删除前面的+、-符号。
因为.pug和.styl以及.yml等对缩进要求较为严格，请尽量不要使用记事本等无法提供语法高亮的文本编辑器进行修改。
本帖基于Butterfly主题进行魔改方案编写，因此请读者优先掌握Butterfly主题官方文档的内容后再来进行魔改。
魔改会过程常常引入自定义的css与js文件，方法见Hexo博客添加自定义css和js文件(太懒了不想自己写)
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一)
博客搭建基础教程(二)
博客搭建 ...
博客魔改教程总结(二)
魔改前必看（太细节的就不写在教程中了，我也不会🤣🤣🤣）
博客魔改有风险，如果博客魔改出问题了又没有备份，可通过此项目查看基础源码进行回滚：jerryc127/hexo-theme-butterfly、ccknbc-actions/blog-butterfly。
这部分魔改基本上都是大佬们造好的轮子，我按照大佬们的轮子结合自己的喜好进行魔改的。
鉴于每个人的根目录名称都不一样，本帖博客根目录一律以[BlogRoot]指代。
本帖涉及魔改源码的内容，会使用diff代码块标识，复制时请不要忘记删除前面的+、-符号。
因为.pug和.styl以及.yml等对缩进要求较为严格，请尽量不要使用记事本等无法提供语法高亮的文本编辑器进行修改。
本帖基于Butterfly主题进行魔改方案编写，因此请读者优先掌握Butterfly主题官方文档的内容后再来进行魔改。
魔改会过程常常引入自定义的css与js文件，方法见Hexo博客添加自定义css和js文件(太懒了不想自己写)
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一)
博客搭建基础教程(二)
博客搭建 ...
博客魔改教程总结(一)
魔改前必看（太细节的就不写在教程中了，我也不会🤣🤣🤣）
博客魔改有风险，如果博客魔改出问题了又没有备份，可通过此项目查看基础源码进行回滚：jerryc127/hexo-theme-butterfly、ccknbc-actions/blog-butterfly。
这部分魔改基本上都是大佬们造好的轮子，我按照大佬们的轮子结合自己的喜好进行魔改的。
鉴于每个人的根目录名称都不一样，本帖博客根目录一律以[BlogRoot]指代。
本帖涉及魔改源码的内容，会使用diff代码块标识，复制时请不要忘记删除前面的+、-符号。
因为.pug和.styl以及.yml等对缩进要求较为严格，请尽量不要使用记事本等无法提供语法高亮的文本编辑器进行修改。
本帖基于Butterfly主题进行魔改方案编写，因此请读者优先掌握Butterfly主题官方文档的内容后再来进行魔改。
魔改会过程常常引入自定义的css与js文件，方法见Hexo博客添加自定义css和js文件(太懒了不想自己写)
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一)
博客搭建基础教程(二)
博客搭建 ...
博客搭建基础教程(三)
前言
参考：Hexo博客搭建基础教程(三)，Butterfly 安裝文檔(三) 主題頁面，Butterfly 安裝文檔(四) 主題配置-2 | Butterfly参考或者直接搬运他们的教程，方便收藏，不怕某天作者的博客突然挂了导致无法参考🙈🙈🙈Fomalhaut大佬在B站有搭建视频，而且博客进行了开源，可以去大力支持一波👍全程我将会和大家一起进行搭建，大家可以放心食用。
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一)
博客搭建基础教程(二)
博客搭建基础教程(三) ⇦当前位置🪂
前言
博客搭建过程遇到任何问题，优先在本页面搜索，检查是否已经有该配置教程。
无法解决问题可以阅读Fomalhaut的博客或者官方搭建教程寻求解决方案。
你也可以在文章评论区留言，注意留言时请填写正确的邮箱以确保能收到站长的回复。
语言修改站点配置文件_config.yml，默认语言是 en 。支持三种语言
default（英语）
zh-CN（简体中文）
zh-TW（繁体中文）
网站资料修改网站各种资料，例如标题、副标题和邮箱等个人资料，请修改站点配置文件_con ...
博客搭建基础教程(二)
前言
这部分教程感谢fomalhaut大佬的文章Hexo博客搭建基础教程(二)和butterfly官方文档Butterfly 安裝文檔(二) 主題頁面参考或者直接搬运他们的教程，方便收藏，不怕某天作者的博客突然挂了导致无法参考🙈🙈🙈Fomalhaut大佬在B站有搭建视频，而且博客进行了开源，可以去大力支持一波👍全程我将会和大家一起进行搭建，大家可以放心食用。
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一)
博客搭建基础教程(二) ⇦当前位置🪂
前言
博客搭建过程遇到任何问题，优先在本页面搜索，检查是否已经有该配置教程。
无法解决问题可以阅读Fomalhaut的博客或者官方搭建教程寻求解决方案。
你也可以在文章评论区留言，注意留言时请填写正确的邮箱以确保能收到站长的回复。
Vercel部署与自定义域名
Vercel部署
Vercel简介：vercel是一个代码托管平台，它能够托管你的静态html界面，甚至能够托管你的node.js与Python服务端脚本，是不想买服务器的懒人的福音！
使用Vercel部署Hexo项目步骤：
<1> ...
博客搭建基础教程(一)
前言
这部分教程感谢fomalhaut大佬的文章Hexo博客搭建基础教程(一)和butterfly官方文档Butterfly 安装文档(一) 快速开始参考或者直接搬运他们的教程，方便收藏，不怕某天作者的博客突然挂了导致无法参考🙈🙈🙈Fomalhaut大佬在B站有搭建视频，而且博客进行了开源，可以去大力支持一波👍全程我将会和大家一起进行搭建，大家可以放心食用。
博客搭建与魔改系列教程导航🚥🚥🚥
博客搭建基础教程(一) ⇦当前位置🪂
前言
博客搭建过程遇到任何问题，优先在本页面搜索，检查是否已经有该配置教程。
无法解决问题可以阅读Fomalhaut的博客或者官方搭建教程寻求解决方案。
你也可以在文章评论区留言，注意留言时请填写正确的邮箱以确保能收到站长的回复。
环境与工具准备本教程面对的是Windows用户，博主也只在Windows环境下搭建
操作系统: Windows11
NodeJs: v18.17.1 (LTS)
Git: 2.39.1.windows.1
Hexo: v7.0.0
VSCode: v1.81.0
GitHub 帐号
一个域名（强烈推 ...