首页
butterfly提供了令人惊艳的首页展示，很多小伙伴都是被首页吸引而来。那么首页的魔改对于博客肯定是高优先级的调整了。
组件
在文章顶部添加一些自定义的组件用来展示信息。
首页磁贴 - Akilar
本项目是对冰卡诺老师写的教程：基于Butterfly主题的分类磁贴2.0版进行重构，去除了所有繁杂的引入js的过程，所以也就无需引入jquery和vue，也完美支持pjax。当前4.0版本可以自动获取分类及文章数。封面和描述配置项直接嵌入配置文件。支持自定义行数，超过自动切换为滚动显示。可选择三列或四列显示。
首页置顶轮播图 - Akilar
本项目是对冰卡诺老师写的教程：基于Butterfly主题的轮播手动置顶文章进行重构，精简了部分样式。适配pjax。
NPM 插件安装的部署方法
gitcalendar - Akilar
基于@冰卡诺老师的项目做了微调。进行
pjax适配，提取配置项。转换成插件化配置，通过配置文件开关控制各类样式资源的引入。补全自建API的部署教程。
教程：hexo-githubcalendar 插件 1.0 - 小冰
最近在各个群友的催促下，小冰也不再咕咕咕了，首先第一弹则是经典魔改作品 githubcalendar 的插件化。鉴于对主题进行过度魔改会大大增加更新的难度以及主题作者的维护难度，本着简化更新步骤及降低魔改难度的目的，小冰特此学习了如***一般的 hexo api 文档，并在@lete 乐特老师的帮助下艰难的适配了 pjax（谁叫金牌售后@akilar被万恶的 mc 给拐跑了，可怜的小冰只好自己适配 pjax 了）。虽说插件目前还有些小 bug，但日常使用基本没啥问题，也欢迎提出 pr。
Butterfly魔改：动态分类条，可以根据页面变化而改变的分类列表展示方式 - 张洪Heo
好久没有写魔改教程了，今天带来一个最近琢磨的一个分类条的显示。以前非常喜欢这种tab切换就能更换列表文章的显示方式，可是静态博客想要做到这一点真的是太难了，而且是原生html，不是vue。我的博客一直没有能够在首页展示分类的入口。起初因为分类比较少，但是现在已经很多了。那么一个展示分类的条就是非常必要的了。
这个分类条非常简约，原生js。魔改需要自己具备一定的魔改基础。
Hexo博客 | 动态分类标签条，自动获取全站分类与标签进行展示 - Justlovesmile
本文是对Heo博主写的Butterfly魔改：动态分类条，可以根据页面变化而改变的分类列表展示方式文章的补充，增加了动态标签条，并且可以自动获取全站分类和标签名称。
其实这个插件和hexo-swiper-bar几天前就写好了，但是我懒，所以没写教程。
Hexo butterfly首页随便逛逛banner教程 - LYX
不出意外，这又是一篇水文。这段时间不怎么更新就是因为要开学了要赶作业，而且也在折腾其它的不少东西。相信你们也看到了博客的大变，具体见更新日志。
为博客顶部添加滚动banner及文章推荐卡片 - 随风起
给大家分享下博客主页顶部推荐文章如何实现，主要参考自heo
具体效果如下
源计划-方舟：首页轮播图 - Akilar
本篇讨论的轮播图的配置项可能与hexo-butterfly-swiper插件的配置项有冲突，如果您曾经安装过该插件或者该插件的衍生插件(例如anzhiyu、anzhiyupro、allbs、ihao、lyx、btmuli,
一查才知道已经有这么多亚种了吗)。请确保您已经卸载了它们。
新版首页轮播图 - Marcus
给博客添加首页轮播图
首页轮播图 - Marcus
添加 hometop
Banner随机文章展示 - Chuckle
这篇文章介绍了如何修改懒加载和随机展示文章的方法。作者首先创建了一个生成器文件来输出具有随机配置的文章的信息，并通过请求JSON文件来在页面上随机展示这些文章。接着，作者讨论了在使用懒加载功能时可能会出现的bug，并提出了解决方案，即修改特定的JavaScript文件以使部分图片不受懒加载控制。
Butterfly首页动态分类条 - 清羽飞扬
最近添加了
memos首页轮播后，愈发感觉分类卡片略显臃肿，并且我也不太喜欢卡片边上突兀的上下滚动条，恰好solitude的分类条感觉非常好看，于是下载了Solitude主题的源码，尝试将首页的分类条剥离了出来，最终实现了效果。
文章卡片
文章卡片的样式可以自定义成自己喜欢的。
首页文章卡片修改 - Akilar
贰猹和我交流了下他对主题首页卡片的设计想法，效果很不错。原本呢，贰猹是打算等自己学好了前端就把这个卡片写出来的。然后，就这么咕咕咕了一个寒假（
其实是被木木抓起来关进小黑屋里写友链朋友圈后端API，写不好不给饭吃）。冰老师在鸽之灵，看到后继有鸽，也会很欣慰吧。 然后我就忍不住了啊，这么优秀的设计，等贰猹写出来我要等到啥时候。二话不说，征求了贰猹的授权以后，咱就开始动手进行试做。
几行代码实现最新文章标志 - Leonus
在开始之前，如果你没有自定义js和css文件，请先查看此文章：Hexo博客添加自定义css和js文件
Butterfly文章卡片加上最新文章标志 - 轻笑Chuckle
昨天@Leonus大佬用js给首页最新的文章卡片加上了最新标志:几行代码实现最新文章标志 | Leonus 不过每次切换到首页都要执行这个js，不然最新标志就不显示，开启了pjax之后,怎么让这js每次切换到首页都执行是个问题，而且每次都执行也会多吃一些性能
Butterfly给首页首个文章卡片加个class - 轻笑Chuckle
看@heo的博客首页，他的第一个文章卡片是其余卡片宽度的两倍，F12可知是首页的首个文章卡片多了一个class，虽然我的文章卡片暂时没这需求，但刚好有人问怎么才能控制首页第一个文章卡片的样式，也刚好我有思路，就实现一下吧
NPM 插件安装的部署方法
同时支持置顶和隐藏文章的 hexo 生成器插件 - 0o酱
支持置顶与隐藏文章的 Hexo 首页生成器插件。
在官方的首页生成器的基础上添加了使用
top置顶文章和hide隐藏文章的功能。
源计划-方舟：首页卡片 - Akilar
本篇需要用到iconfont作为卡片底部的装饰性图标。请先完成前置教程：Hexo引入阿里矢量图标库，务必确保symbol方案能够使用后再进行下方内容。