δΈ­ζ–‡
# hexo-theme-butterfly ![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/master?color=%231ab1ad&label=master) ![master version](https://img.shields.io/github/package-json/v/jerryc127/hexo-theme-butterfly/dev?label=dev) ![https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff](https://img.shields.io/npm/v/hexo-theme-butterfly?color=%09%23bf00ff) ![hexo version](https://img.shields.io/badge/hexo-5.3.0+-0e83c) ![license](https://img.shields.io/github/license/jerryc127/hexo-theme-butterfly?color=FF5531) ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/theme-butterfly-readme.png) πŸ“’ Demo: [Butterfly](https://butterfly.js.org/) || [CrazyWong](https://blog.crazywong.com/) πŸ“– Docs: [English](https://butterfly.js.org/en/posts/butterfly-docs-en-get-started/) || [Chinese](https://butterfly.js.org/posts/21cfbf15/) Based on [hexo-theme-melody](https://github.com/Molunerfinn/hexo-theme-melody) theme. ## πŸ’» Installation ### GIT > If you are in Mainland China, you can download in [Gitee](https://gitee.com/immyw/hexo-theme-butterfly.git) Stable branch [recommend]: ``` git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly ``` Dev branch: ``` git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly ``` ### NPM > It supports Hexo 5.0.0 or later In Hexo site root directory ```powershell npm i hexo-theme-butterfly ``` ## βš™ Configuration Set theme in the hexo work folder's root config file `_config.yml`: > theme: butterfly If you don't have pug & stylus renderer, try this: > npm install hexo-renderer-pug hexo-renderer-stylus ## πŸŽ‰ Features - [x] Card UI Design - [X] Support sub-menu - [x] Two-column layout - [x] Responsive Web Design - [x] Dark Mode - [x] Pjax - [x] Read Mode - [x] Conversion between Traditional and Simplified Chinese - [X] TOC catalog is available for both computers and mobile phones - [X] Built-in Syntax Highlighting Themes (darker/pale night/light/ocean/mac/mac light), also support customization - [X] Code Blocks (Display code language/close or expand Code Blocks/Copy Button/word wrap) - [X] Disable copy/Add a Copyright Notice to the Copied Text - [X] Search (Algolia Search/Local Search) - [x] Mathjax and Katex - [x] Built-in 404 page - [x] WordCount - [x] Related articles - [x] Displays outdated notice for a post - [x] Share (Sharejs/Addtoany) - [X] Comment (Disqus/Disqusjs/Livere/Gitalk/Valine/Waline/Utterances/Facebook Comments/Twikoo/Giscus/Remark42/artalk) - [x] Multiple Comment System Support - [x] Online Chats (Chatra/Tidio/Daovoice/Crisp/messenger) - [x] Web analytics - [x] Google AdSense - [x] Webmaster Verification - [x] Change website colour scheme - [x] Typewriter Effect: activate_power_mode - [x] Background effects (Canvas ribbon/canvas_ribbon_piao/canvas_nest) - [x] Mouse click effects (Fireworks/Heart/Text) - [x] Preloader/Loading Animation/pace.js - [x] Busuanzi visitor counter - [x] Medium Zoom/Fancybox - [x] Mermaid - [x] Justified Gallery - [x] Lazyload images - [x] Instantpage/Pangu/Snackbar notification toast/PWA...... ## ✨ Contributors ## πŸ“· Screenshots ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-1.jpg) ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-2.jpg) ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-3.jpg) ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN@m2/img/butterfly-readme-screenshots-4.jpg) ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/theme-butterfly-readme-homepage-1.png) ![](https://cdn.jsdelivr.net/gh/jerryc127/CDN/img/theme-butterfly-readme-homepage-2.png)