gallery

<div class="gallery-group-main">
{% galleryGroup name description link img-url %}
{% galleryGroup name description link img-url %}
{% galleryGroup name description link img-url %}
</div>

<div class="gallery-group-main">
{% galleryGroup '壁纸' '收藏的一些壁纸' '/Gallery/wallpaper' https://i.loli.net/2019/11/10/T7Mu8Aod3egmC4Q.png %}
{% galleryGroup '漫威' '关于漫威的图片' '/Gallery/marvel' https://i.loli.net/2019/12/25/8t97aVlp4hgyBGu.jpg %}
{% galleryGroup 'OH MY GIRL' '关于OH MY GIRL的图片' '/Gallery/ohmygirl' https://i.loli.net/2019/12/25/hOqbQ3BIwa6KWpo.jpg %}
</div>

或者


<div class="gallery-group-main">
{% galleryGroup '壁纸' '收藏的一些壁纸' 'https://cdn.jsdelivr.net/gh/deckcode/HexoStatic@main/img/allimgs/bg1' https://cdn.jsdelivr.net/gh/deckcode/HexoStatic@main/img/allimgs/bg1/blogBack1.jpg %}
{% galleryGroup '壁纸' '关于风景' 'https://cdn.jsdelivr.net/gh/deckcode/HexoStatic@main/img/allimgs/bg2' https://cdn.jsdelivr.net/gh/deckcode/HexoStatic@main/img/allimgs/bg2/11.jpg %}
{% galleryGroup 'cover' '文章封面' 'https://cdn.jsdelivr.net/gh/deckcode/HexoStatic@main/img/allimgs/cover' https://cdn.jsdelivr.net/gh/deckcode/HexoStatic@main/img/allimgs/cover/1.png %}
</div>

gallery相册

{% gallery %}
markdown 图片格式
{% endgallery %}

{% gallery %}
![alt](https://i.loli.net/2019/12/25/Fze9jchtnyJXMHN.jpg)
![alt](https://i.loli.net/2019/12/25/ryLVePaqkYm4TEK.jpg)
![alt](https://i.loli.net/2019/12/25/gEy5Zc1Ai6VuO4N.jpg)
![alt](https://i.loli.net/2019/12/25/d6QHbytlSYO4FBG.jpg)
![alt](https://i.loli.net/2019/12/25/6nepIJ1xTgufatZ.jpg)
![alt](https://i.loli.net/2019/12/25/E7Jvr4eIPwUNmzq.jpg)
![alt](https://i.loli.net/2019/12/25/mh19anwBSWIkGlH.jpg)
![alt](https://i.loli.net/2019/12/25/2tu9JC8ewpBFagv.jpg)
{% endgallery %}

tag-hide

{% hideInline content,display,bg,color %}

哪个英文字母最酷？ {% hideInline 因为西装裤(C装酷),查看答案,#FF7242,#fff %}

门里站着一个人? {% hideInline 闪 %}

哪个英文字母最酷？因为西装裤(C装酷)

门里站着一个人? 闪

{% hideBlock display,bg,color %}
content
{% endhideBlock %}

查看答案
{% hideBlock 查看答案 %}
傻子，怎么可能有答案
{% endhideBlock %}

查看答案

傻子，怎么可能有答案

{% hideToggle display,bg,color %}
content
{% endhideToggle %}

{% hideToggle Butterfly安装方法 %}
在你的博客根目录里

git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

如果想要安装比较新的dev分支，可以

git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

{% endhideToggle %}

Butterfly安装方法

在你的博客根目录里

git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

如果想要安装比较新的dev分支，可以

git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/Butterfly

note

{% note [class] [no-icon] [style] %}
Any content (support inline tags too.io).
{% endnote %}

test

当然icon也可以自己设置

{% note modern %}
默认 提示块标籤
{% endnote %}

{% note default modern %}
default 提示块标籤
{% endnote %}

{% note primary modern %}
primary 提示块标籤
{% endnote %}

{% note success modern %}
success 提示块标籤
{% endnote %}

{% note info modern %}
info 提示块标籤
{% endnote %}

{% note warning modern %}
warning 提示块标籤
{% endnote %}

{% note danger modern %}
danger 提示块标籤
{% endnote %}

当然icon也可以自己设置

默认提示块标籤

default 提示块标籤

primary 提示块标籤

success 提示块标籤

info 提示块标籤

warning 提示块标籤

danger 提示块标籤

mermaid

mermaid标籤不允许嵌套于一些隐藏属性的标籤外挂，例如: tag-hide内的标籤外挂和tabs标籤外挂，这会导致mermaid图示无法正常显示，使用时请留意。
请不要压缩html代码，不然会导致mermaid显示异常(3.3.0已修復)
使用mermaid标籤可以绘製Flowchart（流程图）、Sequence diagram（时序图）、Class Diagram（类别图）、State Diagram（状态图）、Gantt（甘特图）和Pie Chart（圆形图），具体可以查看mermaid文档

{% mermaid %}
pie
    title Key elements in Product X
    "Calcium" : 42.96
    "Potassium" : 50.05
    "Magnesium" : 10.01
    "Iron" :  5
{% endmermaid %}

pie title Key elements in Product X "Calcium" : 42.96 "Potassium" : 50.05 "Magnesium" : 10.01 "Iron" : 5

post_link

作者: Jerry
連結: https://butterfly.js.org/posts/4aa8abbe/#Tabs
來源: Butterfly
著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。

自定义插件

当前路径下注册自己的插件名字

node_modules\hexo\lib\plugins\tag\index.js
比如

tag.register(‘bili’, require(’./bili’))
然后在当前路径下插件bili.js文件
内容如下

'use strict';

const { htmlTag } = require('hexo-util');

/*

'<div style="position: relative; width: 100%; height: 0; padding-bottom: 75%;"><iframe ' +
        'src="//player.bilibili.com/player.html?'+id+'" scrolling="no" border="0" ' +
        'frameborder="no" framespacing="0" allowfullscreen="true" style="position: absolute; width: 100%; ' +
        'height: 100%; left: 0; top: 0;"> </iframe></div>';

 */


function bili(args) {
    const id = args[0];

    const attrs = {
        src: '//player.bilibili.com/player.html?' + id,
        style: 'position: absolute; width: 100%; height: 100%; left: 0; top: 0;',
        frameborder: '0',
        framespacing: 'no',
        border: 'no',
        scrolling: 'no',
        allowfullscreen: true
    };

    const iframetag = htmlTag('iframe', attrs, '');

    const attrs2 = {
        style: 'position: relative; width: 100%; height: 0; padding-bottom: 75%;'
    }
    return htmlTag('div', attrs2, iframetag, false);

}

module.exports = bili;

tag-plugins

post_link

自定义插件

主要是资源整理