text: (window.webpackJsonp=window.webpackJsonp||[]).push([[71],{493:function(s,t,a){"use strict";a.r(t);var n=a(15),e=Object(n.a)({},(function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ContentSlotsDistributor",{attrs:{"slot-key":s.$parent.slotKey}},[a("h1",{attrs:{id:"butterfly美化"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#butterfly美化"}},[s._v("#")]),s._v(" Butterfly美化")]),s._v(" "),a("h2",{attrs:{id:"主题配置文件修改"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#主题配置文件修改"}},[s._v("#")]),s._v(" 主题配置文件修改")]),s._v(" "),a("h3",{attrs:{id:"基础配置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#基础配置"}},[s._v("#")]),s._v(" 基础配置")]),s._v(" "),a("p",[s._v("最最最开始的，好不容易搭建了自己的个人博客，当然要写上自己的名字、签名......，证明身份。而且身为一个Chinese，还是中文舒服，所以主目录下"),a("code",[s._v("_config.yml")]),s._v("的配置文件：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Site")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" FATE      "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#标题名字")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("subtitle")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("description")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),s._v("  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#签名")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("keywords")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("author")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" MoYu"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("zc  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#作者名字")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("language")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" zh"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("CN  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#默认en  可以改为这个")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("timezone")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br")])]),a("p",[s._v("主题支持以下三种语言：")]),s._v(" "),a("ul",[a("li",[s._v("default(en)")]),s._v(" "),a("li",[s._v("zh-CN (简体中文)")]),s._v(" "),a("li",[s._v("zh-TW (繁体中文)")])]),s._v(" "),a("img",{staticStyle:{zoom:"50%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214445.png",alt:"1"}}),s._v(" "),a("img",{staticStyle:{zoom:"90%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214505.png",alt:"2"}}),s._v(" "),a("h3",{attrs:{id:"导航栏修改"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#导航栏修改"}},[s._v("#")]),s._v(" 导航栏修改")]),s._v(" "),a("p",[s._v("主目录下"),a("code",[s._v("\\source\\_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v(":")]),s._v(" "),a("p",[s._v("（如果没有这个文件夹，创建一个"),a("code",[s._v("_data")]),s._v("，把"),a("code",[s._v("\\themes\\butterfly")]),s._v("也就是主题文件夹下的"),a("code",[s._v("_config.yml")]),s._v("移动到"),a("code",[s._v("_data")]),s._v("文件夹下，重命名为"),a("code",[s._v("butterfly.yml")]),s._v("，以后只需要修改这个文件。这样为了留个备份，你搞坏了配置，还可以重新换成最开始的状态）    ↓： "),a("code",[s._v("名称: /xxxx/ || 图标")])]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("menu")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("首页")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" / "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("home\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("归档")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /archives/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("archive\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("标签")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /tags/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("tags\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("分类")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /categories/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("folder"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("open\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("留言板")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /messageboard/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("paper"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("plane\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("友链")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /link/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("link\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("日志")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /timeline/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("bell\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("菜单 || fa fa-list")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 关于 "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" /about/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("sitemap\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" myself "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" /myself/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("id"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("card\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" butterfly主题 "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//github.com/jerryc127/hexo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("theme"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("butterfly/ "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" fa fa"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("heart\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214537.png",alt:"3"}})]),s._v(" "),a("h3",{attrs:{id:"代码块样式"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#代码块样式"}},[s._v("#")]),s._v(" 代码块样式")]),s._v(" "),a("p",[s._v("主目录下"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v(":")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("## 代码块样式")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("highlight_theme")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" mac "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#default/darker/pale night/light/ocean/mac /false/  前面的参数任选一项为代码块显示效果")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("highlight_copy")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# copy button  是否显示复制按钮")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("highlight_lang")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# show the code language 是否显示代码块语言")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("highlight_shrink")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#true:打开文章默认折叠代码块内容/false:打开文章默认展开代码块/none:关闭代码折叠按钮")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("code_word_wrap")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 关闭滚动条")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("p",[s._v("然后找到 Hexo 配置文件"),a("code",[s._v("_config.yml")]),s._v("，将"),a("code",[s._v("line_number")]),s._v("改成"),a("code",[s._v("false")]),s._v(":")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("highlight")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("line_number")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 改为false")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("auto_detect")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("tab_replace")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214554.png",alt:"4"}})]),s._v(" "),a("h3",{attrs:{id:"本地搜索"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#本地搜索"}},[s._v("#")]),s._v(" 本地搜索")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Local search 本地搜索")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("local_search")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("labels")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("input_placeholder")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" Search for Posts\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("hits_empty")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"We didn\'t find any results for the search: ${query}"')]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 如果没有查到内容相关内容显示")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("p",[s._v("需要安装插件，不然"),a("code",[s._v("hexo g")]),s._v("直接报错：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("npm install hexo"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),s._v("generator"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),s._v("search "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("--")]),s._v("save\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214613.png",alt:"5"}})]),s._v(" "),a("h3",{attrs:{id:"分割线图标更换"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#分割线图标更换"}},[s._v("#")]),s._v(" 分割线图标更换")]),s._v(" "),a("p",[s._v("本次修改基于Butterfly主题 3.0.0 ！")]),s._v(" "),a("p",[s._v("将图标更换为“太空飞船”。")]),s._v(" "),a("p",[s._v("修改butterfly主题配置文件"),a("code",[s._v("_data")]),s._v("--"),a("code",[s._v("_config.yml")]),s._v(" ：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("hr_icon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("icon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'\\f197'")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# the unicode value of Font Awesome icon")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("icon-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("10px\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("p",[a("code",[s._v("icon-top")]),s._v("常用数值：")]),s._v(" "),a("p",[s._v("-20px：图标位于分割线上方")]),s._v(" "),a("p",[s._v("-10px：图标位于分割线中间")]),s._v(" "),a("p",[s._v("0px：图标位于分割线下方")]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214626.png",alt:"6"}})]),s._v(" "),a("h3",{attrs:{id:"创建标签文件夹"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#创建标签文件夹"}},[s._v("#")]),s._v(" 创建标签文件夹")]),s._v(" "),a("p",[s._v("会在"),a("code",[s._v("\\source")]),s._v("中创建对应的"),a("code",[s._v("文件夹")]),s._v("和"),a("code",[s._v("index.md")])]),s._v(" "),a("h4",{attrs:{id:"_1-归档"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-归档"}},[s._v("#")]),s._v(" 1.归档")]),s._v(" "),a("p",[s._v("这个页面"),a("code",[s._v("不用创建")]),s._v("，自动已经带了")]),s._v(" "),a("h4",{attrs:{id:"_2-标签"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-标签"}},[s._v("#")]),s._v(" 2.标签")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" tags\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/tags/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 标签\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" tags")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[s._v("以后上传文章的md文件中，可以在标题头中加入"),a("code",[s._v("tags")]),s._v("，包含 "),a("code",[s._v("标签")]),s._v(" 文章的例子：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 标签测试\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("tags")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 1111                 （这个就是文章的标签了）\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 2222              （这个就是文章的标签了）")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("h4",{attrs:{id:"_3-分类"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_3-分类"}},[s._v("#")]),s._v(" 3.分类")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" categories\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/categories/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 分类\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" categories")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[s._v("以后上传文章的md文件中，可以在标题头中加入"),a("code",[s._v("categories")]),s._v("，包含 "),a("code",[s._v("分类")]),s._v(" 文章的例子：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 分类测试\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("categories")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 1111                   （这个就是文章的分类了）\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 2222                   （这个就是文章的分类了）")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("h4",{attrs:{id:"_4-留言板"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_4-留言板"}},[s._v("#")]),s._v(" 4.留言板")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" messageboard\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/messageboard/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 留言板\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" messageboard")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("h4",{attrs:{id:"_5-友链"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_5-友链"}},[s._v("#")]),s._v(" 5.友链")]),s._v(" "),a("h5",{attrs:{id:"_5-1、创建友情链接页面"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_5-1、创建友情链接页面"}},[s._v("#")]),s._v(" 5.1、创建友情链接页面")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" link\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/link/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 友链\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" link")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("h5",{attrs:{id:"_5-2、友情链接添加"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_5-2、友情链接添加"}},[s._v("#")]),s._v(" 5.2、友情链接添加")]),s._v(" "),a("p",[s._v("在Hexo目录中的"),a("code",[s._v("source/_data")]),s._v("，创建一个文件"),a("code",[s._v("link.yml")]),s._v("，内容如下：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("class")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("class_name")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 友情链接\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("link_list")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("name")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 姓名\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("link")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 链接\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("avatar")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 图片\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("descr")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 签名\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("2")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("name")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 姓名\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("link")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 链接\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("avatar")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 图片\n      "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("descr")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 签名\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br")])]),a("h4",{attrs:{id:"_6-日志"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_6-日志"}},[s._v("#")]),s._v(" 6.日志")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" timeline\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/timeline/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 日志\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" timeline")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("h4",{attrs:{id:"_7-关于"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_7-关于"}},[s._v("#")]),s._v(" 7.关于")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" about\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/about/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 关于\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" about")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("h4",{attrs:{id:"_8-myself"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_8-myself"}},[s._v("#")]),s._v(" 8.myself")]),s._v(" "),a("p",[s._v("命令行输入：")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("hexo "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("page")]),s._v(" myself\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("出现"),a("code",[s._v("source/myself/index.md")]),s._v("文件：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[a("span",{pre:!0,attrs:{class:"token front-matter-block"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token font-matter yaml language-yaml"}},[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("title")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" This is me\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("2018-01-05 00:00:00")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" myself")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("---")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("h3",{attrs:{id:"标题样式"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#标题样式"}},[s._v("#")]),s._v(" 标题样式")]),s._v(" "),a("h4",{attrs:{id:"_1-副标题设置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-副标题设置"}},[s._v("#")]),s._v(" 1.副标题设置")]),s._v(" "),a("p",[s._v("如果没设置"),a("code",[s._v("副标题")]),s._v("，上面的"),a("code",[s._v("description：")]),s._v("签名，就是显示在主页面。而设置的话，"),a("code",[s._v("签名")]),s._v("自动不显示，"),a("code",[s._v("副标题")]),s._v("出现。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v(":")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("subtitle")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n\n "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("sub")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 何其荣幸 何德何能\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 所有的不平凡都来自平凡\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("p",[s._v("这个他们可以设置以下，"),a("code",[s._v("打字效果")]),s._v("可以开启，个人感觉不错，但是需要注意：")]),s._v(" "),a("div",{staticClass:"language- line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-text"}},[a("code",[s._v(" # 如果有英文逗号' , ',使用转义字元 &#44;\n # 如果有英文双引号' \" ',使用转义字元 &quot;\n # 开头不允許转义字元，如需要，請把整个句子用双引号包住\n # 如果关闭打字效果，subtitle只会显示sub的第一行文字\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("p",[s._v("我尝试了"),a("code",[s._v("转义字符")]),s._v("，但是会到“，”时，可能会有点卡，可以用"),a("code",[s._v("空格")]),s._v("代替。")]),s._v(" "),a("img",{staticStyle:{zoom:"90%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214722.png",alt:"7"}}),s._v(" "),a("h4",{attrs:{id:"_2-副标题字体大小颜色"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-副标题字体大小颜色"}},[s._v("#")]),s._v(" 2.副标题字体大小颜色")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\themes\\butterfly\\source\\css\\_layout")]),s._v("中的"),a("code",[s._v("head.styl")]),s._v(":")]),s._v(" "),a("div",{staticClass:"language-styl line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-styl"}},[a("code",[a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("#site-subtitle")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("var")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("white")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v("   此处修改为白色")])]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("font-size")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1.05")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("em")]),s._v("     字体大小")]),s._v("\n\n    +"),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("minWidth768")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("font-size")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1.40")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("em")]),s._v("   字体大小")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("h3",{attrs:{id:"图片设置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#图片设置"}},[s._v("#")]),s._v(" 图片设置")]),s._v(" "),a("p",[s._v("图片可以使用"),a("code",[s._v("网上的图片")]),s._v("(即使用该"),a("code",[s._v("图片链接")]),s._v(")，也可以使用"),a("code",[s._v("\\themes\\butterfly\\source\\img")]),s._v("下的图片。")]),s._v(" "),a("h4",{attrs:{id:"_1-网站图标"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-网站图标"}},[s._v("#")]),s._v(" 1.网站图标")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Favicon（网站图标）")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("favicon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/favicon.png\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("h4",{attrs:{id:"_2-头像"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-头像"}},[s._v("#")]),s._v(" 2.头像")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Avatar (头像)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("avatar")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tit.png\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("effect")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("h4",{attrs:{id:"_3-主页面图片"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_3-主页面图片"}},[s._v("#")]),s._v(" 3.主页面图片")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# The banner image of home page (主页的横幅图像)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("index_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/index_img.jpg\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("h4",{attrs:{id:"_4-子标签页图片"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_4-子标签页图片"}},[s._v("#")]),s._v(" 4.子标签页图片")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# The banner image of archive page")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("archive_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tag.jpg\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("h4",{attrs:{id:"_5-推荐"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_5-推荐"}},[s._v("#")]),s._v(" 5.推荐")]),s._v(" "),a("ol",[a("li",[s._v("主页的顶部图可以在"),a("code",[s._v("butterfly.yml")]),s._v("设置"),a("code",[s._v("index_img")])]),s._v(" "),a("li",[s._v("``archives"),a("code",[s._v("页的顶部图可以在")]),s._v("Butterfly.yml"),a("code",[s._v("设置")]),s._v("archive_img`")]),s._v(" "),a("li",[s._v("其他"),a("code",[s._v("page页")]),s._v("的顶部图可以在各自的md页面设置"),a("code",[s._v("front-matter")]),s._v("中的"),a("code",[s._v("top_img")])])]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("favicon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/favicon.png\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("avatar")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tit.png\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("effect")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("index_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/index_img.jpg\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("default_top_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tag.jpg "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#这个推荐：不加入可能部分标签页不出现图片")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("archive_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tag.jpg\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("tag_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tag.jpg\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("category_img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/tag.jpg\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br")])]),a("img",{staticStyle:{zoom:"50%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214754.png",alt:"8"}}),s._v(" "),a("img",{staticStyle:{zoom:"50%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206214812.png",alt:"9"}}),s._v(" "),a("h4",{attrs:{id:"_6-文章列表图片"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_6-文章列表图片"}},[s._v("#")]),s._v(" 6.文章列表图片")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("cover")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# display the cover or not (是否顯示文章封面)")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("index_enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("aside_enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("archives_enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# the position of cover in home page (封面顯示的位置)")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# left/right/both")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" both\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("default_cover")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br")])]),a("p",[s._v("文章封面设置：")]),s._v(" "),a("p",[a("code",[s._v("一个")]),s._v(":")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[s._v(" "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("default_cover")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//i.loli.net/2020/05/01/gkihqEjXxJ5UZ1C.jpg\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[a("code",[s._v("多个")]),s._v(":")]),s._v(" "),a("p",[s._v("此时会"),a("code",[s._v("随机")]),s._v("选择一张。")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[s._v("  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("default_cover")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//i.loli.net/2020/05/01/gkihqEjXxJ5UZ1C.jpg\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//upimage.alexhchu.com/2020/10/21/671e773d973ae.jpg\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//upimage.alexhchu.com/2020/10/21/f5ac68ddaaf64.jpg\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//upimage.alexhchu.com/2020/10/21/5fecb0b094b73.jpg\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[s._v("or"),a("code",[s._v("文章内")])]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215112.png",alt:"10"}})]),s._v(" "),a("h4",{attrs:{id:"_7-图片查看大图"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_7-图片查看大图"}},[s._v("#")]),s._v(" 7.图片查看大图")]),s._v(" "),a("p",[s._v("主目录下"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v(":")]),s._v(" "),a("p",[s._v("这是两种"),a("code",[s._v("方式")]),s._v("，"),a("code",[s._v("只能选择一个")]),s._v(" 或者 "),a("code",[s._v("两个都不选")])]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215141.png",alt:"11"}})]),s._v(" "),a("h4",{attrs:{id:"_8-图片懒加载"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_8-图片懒加载"}},[s._v("#")]),s._v(" 8.图片懒加载")]),s._v(" "),a("p",[s._v("1.新增"),a("code",[s._v("hexo-lazyload-image")]),s._v("模块")]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[s._v("npm install hexo"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),s._v("lazyload"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),s._v("image "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("--")]),s._v("save\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("2.在主目录配置文件"),a("code",[s._v("_config.yml")]),s._v("增加配置")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("lazyload")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("loadingImg")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/loading.gif\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[s._v("这个就是图片没加载出来的时候，出现一个动图转转转。")]),s._v(" "),a("h3",{attrs:{id:"文章页样式"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#文章页样式"}},[s._v("#")]),s._v(" 文章页样式")]),s._v(" "),a("h4",{attrs:{id:"_1-复制的内容后面加上版权信息"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-复制的内容后面加上版权信息"}},[s._v("#")]),s._v(" 1.复制的内容后面加上版权信息")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# copy settings")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# copyright: Add the copyright information after copied content (复制的内容后面加上版权信息)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("copy")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("p",[s._v("（↑这个相信大家都见过，不演示了）")]),s._v(" "),a("h4",{attrs:{id:"_2-文章版权信息"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-文章版权信息"}},[s._v("#")]),s._v(" 2.文章版权信息")]),s._v(" "),a("p",[s._v("在底部会出现对应的作者、链接、声明")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("post_copyright")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("decode")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("license")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" CC BY"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("NC"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("SA 4.0\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("license_url")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//creativecommons.org/licenses/by"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("nc"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("sa/4.0/\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215206.png",alt:"12"}}),s._v(" "),a("h4",{attrs:{id:"_3-toc目录"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_3-toc目录"}},[s._v("#")]),s._v(" 3.TOC目录")]),s._v(" "),a("p",[s._v("在文章页，会有一个目录，用于顯示TOC。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# toc (目錄)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("toc")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("number")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("auto_open")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# auto open the sidebar")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215523.png",alt:"13"}}),s._v(" "),a("h4",{attrs:{id:"_4-相关文章"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_4-相关文章"}},[s._v("#")]),s._v(" 4.相关文章")]),s._v(" "),a("p",[s._v("在文章最下面，会出现"),a("code",[s._v("相关信息文章")]),s._v("的推送。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Related Articles")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("related_post")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("limit")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("6")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Number of posts displayed  显示的文章数")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("date_type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" created "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# or created or updated 文章日期顯示創建日或者更新日")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("h4",{attrs:{id:"_5-打赏"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_5-打赏"}},[s._v("#")]),s._v(" 5.打赏")]),s._v(" "),a("p",[s._v("在你每篇文章的結尾，可以添加打赏按鈕。对应二維碼可以自行配置。")]),s._v(" "),a("p",[s._v("没有提供二维码的，可配置icon图片，然后在link上添加相应的打赏链接。用户点击图片就会跳转到对应链接去。")]),s._v(" "),a("p",[s._v("link可以不写，会默认为图片的链接。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Sponsor/reward")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("reward")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("QR_code")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/wechat.jpg\n       "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("link")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n       "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("text")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" wechat\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("img")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/alipay.jpg\n       "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("link")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n       "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("text")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" alipay\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br")])]),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206212414.png",alt:"14"}}),s._v(" "),a("h3",{attrs:{id:"侧边框样式"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#侧边框样式"}},[s._v("#")]),s._v(" 侧边框样式")]),s._v(" "),a("h4",{attrs:{id:"_1-侧边框出现位置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-侧边框出现位置"}},[s._v("#")]),s._v(" 1.侧边框出现位置")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# aside (側邊欄)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# --------------------------------------")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("aside")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("mobile")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# display on mobile")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" left "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# left or right ")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("p",[a("code",[s._v("left")]),s._v("：侧边框出现在"),a("code",[s._v("左侧")])]),s._v(" "),a("p",[a("code",[s._v("right")]),s._v(":：侧边框出现在"),a("code",[s._v("右侧")])]),s._v(" "),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215623.png",alt:"15"}}),s._v(" "),a("h4",{attrs:{id:"_2-follow-me信息修改"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-follow-me信息修改"}},[s._v("#")]),s._v(" 2.Follow me信息修改")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215642.png",alt:"16"}}),s._v(" "),a("p",[s._v("图中"),a("code",[s._v("icon")]),s._v("图标使用的阿里"),a("code",[s._v("iconfont")]),s._v("图标")]),s._v(" "),a("p",[s._v("具体可参考：本站文章--"),a("code",[s._v("Hexo-使用阿里iconfont图标")])]),s._v(" "),a("h4",{attrs:{id:"_3-公告"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_3-公告"}},[s._v("#")]),s._v(" 3.公告")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("card_announcement")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("content")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" This is my Blog  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#修改此处")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215702.png",alt:"17"}})]),s._v(" "),a("h4",{attrs:{id:"_4-访问人數和运行时间"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_4-访问人數和运行时间"}},[s._v("#")]),s._v(" 4.访问人數和运行时间")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 訪問人數")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("busuanzi")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("site_uv")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("site_pv")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("page_pv")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  \n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 網頁運行時間")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("runtimeshow")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("publish_date")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 10/11/2020 00"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),a("span",{pre:!0,attrs:{class:"token datetime number"}},[s._v("00:00")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#格式: 月/日/年 時間")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#也可以 年/月/日 時間")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215731.png",alt:"18"}})]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215739.png",alt:"19"}})]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215743.png",alt:"20"}})]),s._v(" "),a("h3",{attrs:{id:"特效部分"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#特效部分"}},[s._v("#")]),s._v(" 特效部分")]),s._v(" "),a("h4",{attrs:{id:"_1-鼠标点击特效"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-鼠标点击特效"}},[s._v("#")]),s._v(" 1.鼠标点击特效")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215804.png",alt:"21"}}),s._v(" "),a("h4",{attrs:{id:"_2-鼠标移动特效"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-鼠标移动特效"}},[s._v("#")]),s._v(" 2.鼠标移动特效")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\themes\\butterfly\\source\\css")]),s._v("中创建一个"),a("code",[s._v("css文件")]),s._v("，将以下代码复制进去：")]),s._v(" "),a("div",{staticClass:"language-css line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-css"}},[a("code",[a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("(function fairyDustCursor()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n\n  var possibleColors = ["),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"#D61C59"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"#E7D84B"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"#1B8798"')]),s._v("]\n  var width = window.innerWidth"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  var height = window.innerHeight"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(";\n  var cursor =")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("x")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" width/2"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("y")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" width/2"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  var particles = []"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(";\n\n  function init()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("bindEvents")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("loop")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("// Bind events that are needed\n  function bindEvents()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    document."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addEventListener")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'mousemove'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" onMouseMove"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    document."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addEventListener")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'touchmove'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" onTouchMove"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    document."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addEventListener")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'touchstart'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" onTouchMove"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n\n    window."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addEventListener")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'resize'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" onWindowResize"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function onWindowResize(e)")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    width = window.innerWidth"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    height = window.innerHeight"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function onTouchMove(e)")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("if( e.touches.length > 0 )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("for")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v(" var i = 0"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v(" i < e.touches.length"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("; i++ )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addParticle")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v(" e.touches[i].clientX"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" e.touches[i].clientY"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" possibleColors[Math."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("floor")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("Math."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("random")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v("*possibleColors.length"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v("]"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function onMouseMove(e)")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    cursor.x = e.clientX"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    cursor.y = e.clientY"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addParticle")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v(" cursor.x"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" cursor.y"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" possibleColors[Math."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("floor")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("Math."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("random")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v("*possibleColors.length"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v("]"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function addParticle(x, y, color)")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    var particle = new "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("Particle")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    particle."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("init")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("x"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" y"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" color"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    particles."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("push")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("particle"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function updateParticles()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("for")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v(" var i = 0"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v(" i < particles.length"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("; i++ )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      particles[i]."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("update")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("for")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v(" var i = particles.length -1"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v(" i >= 0"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("; i-- )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("if( particles[i].lifeSpan < 0 )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        particles[i]."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("die")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n        particles."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("splice")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("i"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 1"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function loop()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("requestAnimationFrame")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("loop"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("updateParticles")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function Particle()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n\n    this.character = "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"*"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    this.lifeSpan = 120"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("; //ms\n    this.initialStyles =")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"position"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"fixed"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"top"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"0"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" //必须加\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"display"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"block"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"pointerEvents"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"none"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"z-index"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"10000000"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"fontSize"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"20px"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"will-change"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"transform"')]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(";\n\n    this.init = function(x, y, color)")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n\n      "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("this.velocity =")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("x")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("Math."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("random")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" < 0.5 ? "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-1")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 1"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" * "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("Math."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("random")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" / 2"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("y")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 1\n      "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(";\n\n      this.position =")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("x")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" x - 10"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("y")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" y - 20"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      this.initialStyles.color = color"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      console."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("log")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("color"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n\n      this.element = document."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("createElement")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'span'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      this.element.innerHTML = this.character"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("applyProperties")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("this.element"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" this.initialStyles"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      this."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("update")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n\n      document.body."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("appendChild")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("this.element"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(";\n\n    this.update = function()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      this.position.x += this.velocity.x"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      this.position.y += this.velocity.y"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n      this.lifeSpan--"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n\n      this.element.style.transform = "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"translate3d("')]),s._v(" + this.position.x + "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"px,"')]),s._v(" + this.position.y + "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"px,0) scale("')]),s._v(" + "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("this.lifeSpan / 120"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" + "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('")"')]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("this.die = function()")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      this.element.parentNode."),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("removeChild")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("this.element"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("function applyProperties( target, properties )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("for( var key in properties )")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      target.style[ key ] = properties[ key ]"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n  "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("init")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br"),a("span",{staticClass:"line-number"},[s._v("28")]),a("br"),a("span",{staticClass:"line-number"},[s._v("29")]),a("br"),a("span",{staticClass:"line-number"},[s._v("30")]),a("br"),a("span",{staticClass:"line-number"},[s._v("31")]),a("br"),a("span",{staticClass:"line-number"},[s._v("32")]),a("br"),a("span",{staticClass:"line-number"},[s._v("33")]),a("br"),a("span",{staticClass:"line-number"},[s._v("34")]),a("br"),a("span",{staticClass:"line-number"},[s._v("35")]),a("br"),a("span",{staticClass:"line-number"},[s._v("36")]),a("br"),a("span",{staticClass:"line-number"},[s._v("37")]),a("br"),a("span",{staticClass:"line-number"},[s._v("38")]),a("br"),a("span",{staticClass:"line-number"},[s._v("39")]),a("br"),a("span",{staticClass:"line-number"},[s._v("40")]),a("br"),a("span",{staticClass:"line-number"},[s._v("41")]),a("br"),a("span",{staticClass:"line-number"},[s._v("42")]),a("br"),a("span",{staticClass:"line-number"},[s._v("43")]),a("br"),a("span",{staticClass:"line-number"},[s._v("44")]),a("br"),a("span",{staticClass:"line-number"},[s._v("45")]),a("br"),a("span",{staticClass:"line-number"},[s._v("46")]),a("br"),a("span",{staticClass:"line-number"},[s._v("47")]),a("br"),a("span",{staticClass:"line-number"},[s._v("48")]),a("br"),a("span",{staticClass:"line-number"},[s._v("49")]),a("br"),a("span",{staticClass:"line-number"},[s._v("50")]),a("br"),a("span",{staticClass:"line-number"},[s._v("51")]),a("br"),a("span",{staticClass:"line-number"},[s._v("52")]),a("br"),a("span",{staticClass:"line-number"},[s._v("53")]),a("br"),a("span",{staticClass:"line-number"},[s._v("54")]),a("br"),a("span",{staticClass:"line-number"},[s._v("55")]),a("br"),a("span",{staticClass:"line-number"},[s._v("56")]),a("br"),a("span",{staticClass:"line-number"},[s._v("57")]),a("br"),a("span",{staticClass:"line-number"},[s._v("58")]),a("br"),a("span",{staticClass:"line-number"},[s._v("59")]),a("br"),a("span",{staticClass:"line-number"},[s._v("60")]),a("br"),a("span",{staticClass:"line-number"},[s._v("61")]),a("br"),a("span",{staticClass:"line-number"},[s._v("62")]),a("br"),a("span",{staticClass:"line-number"},[s._v("63")]),a("br"),a("span",{staticClass:"line-number"},[s._v("64")]),a("br"),a("span",{staticClass:"line-number"},[s._v("65")]),a("br"),a("span",{staticClass:"line-number"},[s._v("66")]),a("br"),a("span",{staticClass:"line-number"},[s._v("67")]),a("br"),a("span",{staticClass:"line-number"},[s._v("68")]),a("br"),a("span",{staticClass:"line-number"},[s._v("69")]),a("br"),a("span",{staticClass:"line-number"},[s._v("70")]),a("br"),a("span",{staticClass:"line-number"},[s._v("71")]),a("br"),a("span",{staticClass:"line-number"},[s._v("72")]),a("br"),a("span",{staticClass:"line-number"},[s._v("73")]),a("br"),a("span",{staticClass:"line-number"},[s._v("74")]),a("br"),a("span",{staticClass:"line-number"},[s._v("75")]),a("br"),a("span",{staticClass:"line-number"},[s._v("76")]),a("br"),a("span",{staticClass:"line-number"},[s._v("77")]),a("br"),a("span",{staticClass:"line-number"},[s._v("78")]),a("br"),a("span",{staticClass:"line-number"},[s._v("79")]),a("br"),a("span",{staticClass:"line-number"},[s._v("80")]),a("br"),a("span",{staticClass:"line-number"},[s._v("81")]),a("br"),a("span",{staticClass:"line-number"},[s._v("82")]),a("br"),a("span",{staticClass:"line-number"},[s._v("83")]),a("br"),a("span",{staticClass:"line-number"},[s._v("84")]),a("br"),a("span",{staticClass:"line-number"},[s._v("85")]),a("br"),a("span",{staticClass:"line-number"},[s._v("86")]),a("br"),a("span",{staticClass:"line-number"},[s._v("87")]),a("br"),a("span",{staticClass:"line-number"},[s._v("88")]),a("br"),a("span",{staticClass:"line-number"},[s._v("89")]),a("br"),a("span",{staticClass:"line-number"},[s._v("90")]),a("br"),a("span",{staticClass:"line-number"},[s._v("91")]),a("br"),a("span",{staticClass:"line-number"},[s._v("92")]),a("br"),a("span",{staticClass:"line-number"},[s._v("93")]),a("br"),a("span",{staticClass:"line-number"},[s._v("94")]),a("br"),a("span",{staticClass:"line-number"},[s._v("95")]),a("br"),a("span",{staticClass:"line-number"},[s._v("96")]),a("br"),a("span",{staticClass:"line-number"},[s._v("97")]),a("br"),a("span",{staticClass:"line-number"},[s._v("98")]),a("br"),a("span",{staticClass:"line-number"},[s._v("99")]),a("br"),a("span",{staticClass:"line-number"},[s._v("100")]),a("br"),a("span",{staticClass:"line-number"},[s._v("101")]),a("br"),a("span",{staticClass:"line-number"},[s._v("102")]),a("br"),a("span",{staticClass:"line-number"},[s._v("103")]),a("br"),a("span",{staticClass:"line-number"},[s._v("104")]),a("br"),a("span",{staticClass:"line-number"},[s._v("105")]),a("br"),a("span",{staticClass:"line-number"},[s._v("106")]),a("br"),a("span",{staticClass:"line-number"},[s._v("107")]),a("br"),a("span",{staticClass:"line-number"},[s._v("108")]),a("br"),a("span",{staticClass:"line-number"},[s._v("109")]),a("br"),a("span",{staticClass:"line-number"},[s._v("110")]),a("br"),a("span",{staticClass:"line-number"},[s._v("111")]),a("br"),a("span",{staticClass:"line-number"},[s._v("112")]),a("br"),a("span",{staticClass:"line-number"},[s._v("113")]),a("br"),a("span",{staticClass:"line-number"},[s._v("114")]),a("br"),a("span",{staticClass:"line-number"},[s._v("115")]),a("br"),a("span",{staticClass:"line-number"},[s._v("116")]),a("br"),a("span",{staticClass:"line-number"},[s._v("117")]),a("br"),a("span",{staticClass:"line-number"},[s._v("118")]),a("br"),a("span",{staticClass:"line-number"},[s._v("119")]),a("br"),a("span",{staticClass:"line-number"},[s._v("120")]),a("br"),a("span",{staticClass:"line-number"},[s._v("121")]),a("br"),a("span",{staticClass:"line-number"},[s._v("122")]),a("br"),a("span",{staticClass:"line-number"},[s._v("123")]),a("br")])]),a("p",[s._v("接着，在"),a("code",[s._v("\\source\\_data")]),s._v("的"),a("code",[s._v("butterfly.yml")]),s._v("引入：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[s._v("  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n     "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(' <script type="text/javascript" src="/js/fairyDustCursor.js"'),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(">")]),s._v("</script"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(">")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215845.png",alt:"22"}})]),s._v(" "),a("p",[a("code",[s._v("忽略")]),s._v("以下图片，可以自行尝试。")]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215851.png",alt:"23"}})]),s._v(" "),a("h4",{attrs:{id:"_3-打字特效"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_3-打字特效"}},[s._v("#")]),s._v(" 3.打字特效")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215908.png",alt:"24"}})]),s._v(" "),a("h4",{attrs:{id:"_4-页面特效"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_4-页面特效"}},[s._v("#")]),s._v(" 4.页面特效")]),s._v(" "),a("p",[s._v("{% tabs test2, 3 %}\n")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# canvas_ribbon (靜止彩帶背景)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# See: https://github.com/hustcc/ribbon.js")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("canvas_ribbon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("size")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("150")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("alpha")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0.6")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("zIndex")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("-1")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("click_to_change")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("mobile")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br")])]),a("p",[a("code",[s._v("点击")]),s._v("页面，"),a("code",[s._v("彩带")]),s._v("会进行"),a("code",[s._v("变化")]),s._v("。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Fluttering Ribbon (動態彩帶)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("canvas_fluttering_ribbon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("mobile")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("p",[s._v("这个彩带可以"),a("code",[s._v("动态变换")]),s._v("。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# canvas_nest")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# https://github.com/hustcc/canvas-nest.js")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("canvas_nest")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'0,0,255'")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#线条颜色, default: '0,0,0'; ")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("opacity")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0.7")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 线条的不透明度 (0~1), default: 0.5.")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("zIndex")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("-1")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# z-index property of the background, default: -1.")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("count")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("99")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 线条数量, default: 99.")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("mobile")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br")])]),a("p",[s._v("这个可以鼠标"),a("code",[s._v("自动吸附")]),s._v("。")]),s._v(" "),a("p",[s._v("{% endtabs %}")]),s._v(" "),a("h3",{attrs:{id:"snackbar-弹窗"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#snackbar-弹窗"}},[s._v("#")]),s._v(" Snackbar 弹窗")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Snackbar (Toast Notification 彈窗)")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# position 彈窗位置")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 可選 top-left / top-center / top-right / bottom-left / bottom-center / bottom-right")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("snackbar")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" top"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("right\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("bg_light")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'#49b1f5'")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# light 背景下的样式")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("bg_dark")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'#121212'")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# dark 背景下的样式")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br")])]),a("p",[a("code",[s._v("开启后")]),s._v("，在你设置的位置会有"),a("code",[s._v("可爱的小弹窗")]),s._v("出现。")]),s._v(" "),a("p",[s._v("大家可以尝试一下，按"),a("code",[s._v("个人爱好")]),s._v("开启。")]),s._v(" "),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206215922.png",alt:"25"}}),s._v(" "),a("h3",{attrs:{id:"底部设置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#底部设置"}},[s._v("#")]),s._v(" 底部设置")]),s._v(" "),a("p",[s._v("在 "),a("code",[s._v("butterfly.yml")]),s._v("中配置：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Footer Settings")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# --------------------------------------")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("footer")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("owner")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("since")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("2020")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("custom_text")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("11111")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("copyright")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# false： Hexo那句不显示")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("ICP")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Chinese ICP License   #最后一句")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("url")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" http"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//www.beian.gov.cn\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("text")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 豫ICP备20001029号\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("icon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /img/icp.png\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220004.png",alt:"26"}})]),s._v(" "),a("h2",{attrs:{id:"修改主题文件美化"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#修改主题文件美化"}},[s._v("#")]),s._v(" 修改主题文件美化")]),s._v(" "),a("h3",{attrs:{id:"添加404页面"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#添加404页面"}},[s._v("#")]),s._v(" 添加404页面")]),s._v(" "),a("p",[s._v("1.找到自己心仪的404页面，这个网站很多很多呦。")]),s._v(" "),a("p",[a("strong",[s._v("https://404.life/")])]),s._v(" "),a("p",[s._v("2.在"),a("code",[s._v("\\source")]),s._v("中创建一个"),a("code",[s._v("404文件夹")]),s._v("和一个"),a("code",[s._v("404.html")])]),s._v(" "),a("img",{staticStyle:{zoom:"90%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220030.png",alt:"27"}}),s._v(" "),a("p",[s._v("3.修改"),a("code",[s._v("404.html")]),s._v("内容")]),s._v(" "),a("p",[s._v("​     "),a("code",[s._v("红线")]),s._v("的地方，可以自行选择是否修改")]),s._v(" "),a("p",[s._v("​     "),a("code",[s._v("红框")]),s._v("的地方，必须修改   (可以按照图片中修改)")]),s._v(" "),a("img",{staticStyle:{zoom:"90%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220043.png",alt:"28"}}),s._v(" "),a("img",{staticStyle:{zoom:"90%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220047.png",alt:"29"}}),s._v(" "),a("p",[s._v("4.设置404跳过渲染，在主目录"),a("code",[s._v("_config.yml")]),s._v("中：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("skip_render")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" 404.html\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("p",[s._v("5."),a("code",[s._v("butterfly.yml")]),s._v(" 可以关掉默认的404页面")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# A simple 404 page")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("error_404")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# 关闭")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("subtitle")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'Page Not Found'")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("background")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" https"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("//i.loli.net/2020/05/19/aKOcLiyPl2JQdFD.png\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220102.png",alt:"30"}}),s._v(" "),a("h3",{attrs:{id:"修改滚动条"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#修改滚动条"}},[s._v("#")]),s._v(" 修改滚动条")]),s._v(" "),a("p",[s._v("1.创建一个css文件移动到"),a("code",[s._v("\\themes\\butterfly\\source\\css")]),s._v("目录下。")]),s._v(" "),a("img",{staticStyle:{zoom:"90%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220128.png",alt:"31"}}),s._v(" "),a("p",[s._v("2.引入方式")]),s._v(" "),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220134.png",alt:"32"}})]),s._v(" "),a("p",[s._v("将以下代码复制到你所创建的"),a("code",[s._v("css文件")]),s._v(",引入即可。")]),s._v(" "),a("div",{staticClass:"language-css line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-css"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 滚动条 */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("::-webkit-scrollbar")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("width")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 8px"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("height")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 8px"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("::-webkit-scrollbar-track")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("73"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 177"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 245"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0.2"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 2em"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("::-webkit-scrollbar-thumb")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" #49b1f5"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-image")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("-webkit-linear-gradient")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("\n    45deg"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0.4"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" 25%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    transparent 25%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    transparent 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0.4"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0.4"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" 75%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    transparent 75%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n    transparent\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 2em"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("::-webkit-scrollbar-corner")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" transparent"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("::-moz-selection")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" #fff"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" #49b1f5"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br"),a("span",{staticClass:"line-number"},[s._v("28")]),a("br"),a("span",{staticClass:"line-number"},[s._v("29")]),a("br"),a("span",{staticClass:"line-number"},[s._v("30")]),a("br"),a("span",{staticClass:"line-number"},[s._v("31")]),a("br"),a("span",{staticClass:"line-number"},[s._v("32")]),a("br"),a("span",{staticClass:"line-number"},[s._v("33")]),a("br"),a("span",{staticClass:"line-number"},[s._v("34")]),a("br"),a("span",{staticClass:"line-number"},[s._v("35")]),a("br")])]),a("h3",{attrs:{id:"页脚渐变"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#页脚渐变"}},[s._v("#")]),s._v(" 页脚渐变")]),s._v(" "),a("p",[s._v("将以下代码复制到你所创建的"),a("code",[s._v("css文件")]),s._v(",引入即可。")]),s._v(" "),a("p",[s._v("可参考："),a("code",[s._v("修改滚动条")]),s._v("部分中的"),a("code",[s._v("引入方式")])]),s._v(" "),a("div",{staticClass:"language-css line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-css"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 页脚footer */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 渐变色滚动动画 */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token atrule"}},[a("span",{pre:!0,attrs:{class:"token rule"}},[s._v("@-webkit-keyframes")]),s._v(" Gradient")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("0%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 0 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("50%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 100% 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("100%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 0 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n"),a("span",{pre:!0,attrs:{class:"token atrule"}},[a("span",{pre:!0,attrs:{class:"token rule"}},[s._v("@-moz-keyframes")]),s._v(" Gradient")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("0%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 0 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("50%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 100% 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("100%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 0 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n"),a("span",{pre:!0,attrs:{class:"token atrule"}},[a("span",{pre:!0,attrs:{class:"token rule"}},[s._v("@keyframes")]),s._v(" Gradient")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("0%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 0 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("50%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 100% 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n \n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("100%")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 0 50%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("#footer")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("linear-gradient")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("-45deg"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" #ee7752"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" #ce3e75"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" #23a6d5"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" #23d5ab"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-size")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 400% 400%"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-webkit-animation")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" Gradient 10s ease infinite"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-moz-animation")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" Gradient 10s ease infinite"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("animation")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" Gradient 10s ease infinite"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-o-user-select")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-ms-user-select")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-webkit-user-select")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("-moz-user-select")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("user-select")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top-left-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 10px"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top-right-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 10px"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("#footer:before")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background-color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("0"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" 0"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br"),a("span",{staticClass:"line-number"},[s._v("28")]),a("br"),a("span",{staticClass:"line-number"},[s._v("29")]),a("br"),a("span",{staticClass:"line-number"},[s._v("30")]),a("br"),a("span",{staticClass:"line-number"},[s._v("31")]),a("br"),a("span",{staticClass:"line-number"},[s._v("32")]),a("br"),a("span",{staticClass:"line-number"},[s._v("33")]),a("br"),a("span",{staticClass:"line-number"},[s._v("34")]),a("br"),a("span",{staticClass:"line-number"},[s._v("35")]),a("br"),a("span",{staticClass:"line-number"},[s._v("36")]),a("br"),a("span",{staticClass:"line-number"},[s._v("37")]),a("br"),a("span",{staticClass:"line-number"},[s._v("38")]),a("br"),a("span",{staticClass:"line-number"},[s._v("39")]),a("br"),a("span",{staticClass:"line-number"},[s._v("40")]),a("br"),a("span",{staticClass:"line-number"},[s._v("41")]),a("br"),a("span",{staticClass:"line-number"},[s._v("42")]),a("br"),a("span",{staticClass:"line-number"},[s._v("43")]),a("br"),a("span",{staticClass:"line-number"},[s._v("44")]),a("br"),a("span",{staticClass:"line-number"},[s._v("45")]),a("br"),a("span",{staticClass:"line-number"},[s._v("46")]),a("br"),a("span",{staticClass:"line-number"},[s._v("47")]),a("br"),a("span",{staticClass:"line-number"},[s._v("48")]),a("br"),a("span",{staticClass:"line-number"},[s._v("49")]),a("br"),a("span",{staticClass:"line-number"},[s._v("50")]),a("br"),a("span",{staticClass:"line-number"},[s._v("51")]),a("br"),a("span",{staticClass:"line-number"},[s._v("52")]),a("br"),a("span",{staticClass:"line-number"},[s._v("53")]),a("br"),a("span",{staticClass:"line-number"},[s._v("54")]),a("br"),a("span",{staticClass:"line-number"},[s._v("55")]),a("br"),a("span",{staticClass:"line-number"},[s._v("56")]),a("br"),a("span",{staticClass:"line-number"},[s._v("57")]),a("br"),a("span",{staticClass:"line-number"},[s._v("58")]),a("br"),a("span",{staticClass:"line-number"},[s._v("59")]),a("br"),a("span",{staticClass:"line-number"},[s._v("60")]),a("br"),a("span",{staticClass:"line-number"},[s._v("61")]),a("br")])]),a("h3",{attrs:{id:"更换背景及透明度"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#更换背景及透明度"}},[s._v("#")]),s._v(" 更换背景及透明度")]),s._v(" "),a("h4",{attrs:{id:"_1-透明度"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-透明度"}},[s._v("#")]),s._v(" 1.透明度")]),s._v(" "),a("p",[s._v("将以下代码复制到你所创建的"),a("code",[s._v("css文件")]),s._v(",引入即可。")]),s._v(" "),a("p",[s._v("可参考："),a("code",[s._v("修改滚动条")]),s._v("部分中的"),a("code",[s._v("引入方式")])]),s._v(" "),a("div",{staticClass:"language-css line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-css"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 文章页背景 */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(".layout_post>#post")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 以下代表白色透明度为0.3 */")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(".3"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 所有背景（包括首页卡片、文章页、页面页等） */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("#aside_content .card-widget, #recent-posts>.recent-post-item, .layout_page>div:first-child:not(.recent-posts), .layout_post>#page, .layout_post>#post, .read-mode .layout_post>#post")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* 以下代表白色透明度为0.3 */")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("background")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("rgba")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("255"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(".3"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br")])]),a("h4",{attrs:{id:"_2-更换背景"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-更换背景"}},[s._v("#")]),s._v(" 2.更换背景")]),s._v(" "),a("p",[s._v("老规矩，复制到你所创建的"),a("code",[s._v("css文件")]),s._v(",引入即可。")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#web_bg {")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("background-image")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" linear"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("gradient(to top"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#fff1eb 0%, #ace0f9 100%);")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[s._v("当然这是我的博客"),a("code",[s._v("背景")]),s._v("。")]),s._v(" "),a("p",[s._v("如果你想更改，具体可以参考本博客文章：Hexo之更换背景及透明度")]),s._v(" "),a("h3",{attrs:{id:"移动端优化"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#移动端优化"}},[s._v("#")]),s._v(" 移动端优化")]),s._v(" "),a("p",[a("code",[s._v("\\themes\\butterfly\\source\\css\\_third-party\\normalize.min.css")]),s._v("添加如下css代码：")]),s._v(" "),a("div",{staticClass:"language-css line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-css"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/*移动端优化：去除归档、标签、最新文章、公告、、只保留网站统计*/")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token atrule"}},[a("span",{pre:!0,attrs:{class:"token rule"}},[s._v("@media")]),s._v(" screen "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("and")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("max-width")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 800px"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")])]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("#aside_content\n    div:not(:last-child)")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property"}},[s._v("font-size")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" 13px"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br")])]),a("h3",{attrs:{id:"查看网页rss"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#查看网页rss"}},[s._v("#")]),s._v(" 查看网页RSS")]),s._v(" "),a("p",[s._v("本次修改基于Butterfly主题 3.0.0 ！")]),s._v(" "),a("p",[s._v("实现：增加社交图标RSS，点击可查看网页RSS。")]),s._v(" "),a("p",[s._v("1.下载插件hexo-generator-feed")]),s._v(" "),a("div",{staticClass:"language-shell line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-shell"}},[a("code",[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("npm")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("install")]),s._v(" hexo-generator-feed --save\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("p",[s._v("2.在hexo的主配置文件_config.yml中任意位置添加以下代码：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("feed")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" atom\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("path")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" atom.xml\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("limit")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("20")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("hub")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("content")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("content_limit")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("140")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("content_limit_delim")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' '")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("order_by")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("date\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("icon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" icon.png\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("autodiscovery")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("template")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br")])]),a("p",[s._v("3.修改butterfly主题配置文件_config.yml ，添加RSS的图标：")]),s._v(" "),a("div",{staticClass:"language-yml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("social")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("fa fa-rss")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" /atom.xml "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("|")]),s._v(" RSS链接\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("h3",{attrs:{id:"社交信息设置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#社交信息设置"}},[s._v("#")]),s._v(" 社交信息设置")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改"),a("code",[s._v("social")]),s._v("：")]),s._v(" "),a("p",[s._v("(可以选择使用"),a("code",[s._v("fa fa-xxx")]),s._v("图标，也可以选择使用"),a("code",[s._v("阿里iconfont")]),s._v("图标)")]),s._v(" "),a("p",[s._v("具体可参考：本站文章--"),a("code",[s._v("Hexo-使用阿里iconfont图标")])]),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220226.png",alt:"33"}}),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220230.png",alt:"34"}}),s._v(" "),a("p",[s._v("此处要注意：")]),s._v(" "),a("p",[s._v("​\t很多人不知道自己上方填的网址怎么找")]),s._v(" "),a("p",[s._v("​\t"),a("code",[s._v("RSS")]),s._v("上面有教程，"),a("code",[s._v("Giuhub")]),s._v("、"),a("code",[s._v("Github")]),s._v("、"),a("code",[s._v("CSDN")]),s._v("、"),a("code",[s._v("bilibili")]),s._v("直接"),a("code",[s._v("个人主页")]),s._v("网址就可以")]),s._v(" "),a("p",[s._v("​\t"),a("code",[s._v("QQ")]),s._v("：下方 xxxxxxx 填上对应的"),a("code",[s._v("qq号码")]),s._v("即可")]),s._v(" "),a("div",{staticClass:"language-html line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-html"}},[a("code",[s._v("tencent://AddContact/?fromId=45&fromSubId=1&subcmd=all&uin=xxxxxxx&website=www.oicqzone.com\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("h3",{attrs:{id:"标签外挂"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#标签外挂"}},[s._v("#")]),s._v(" 标签外挂")]),s._v(" "),a("h4",{attrs:{id:"_1-note语法"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_1-note语法"}},[s._v("#")]),s._v(" 1.Note语法")]),s._v(" "),a("p",[s._v("{% tabs test2, 3 %}\n")]),s._v(" "),a("p",[s._v("​\t移植于next主题：可以在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("note")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Note tag style values:")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#  - simple    bs-callout old alert style. Default.")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#  - modern    bs-callout new (v2-v3) alert style.")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#  - flat      flat callout style with background, like on Mozilla or ")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("style")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" flat\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("icons")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("        "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#是否开启图片")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("border_radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("3")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Offset also applied to label tag variables. This option can work with disabled note tag.")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("light_bg_offset")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br")])]),a("p",[s._v("​\t该标签有"),a("code",[s._v("两种")]),s._v("使用方法。")]),s._v(" "),a("p",[s._v("​\t"),a("code",[s._v("默认模板")]),s._v("：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note "),a("span",{pre:!0,attrs:{class:"token url"}},[s._v("["),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("class")]),s._v("] ["),a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("no-icon")]),s._v("]")]),s._v(" [style] %}\nAny content (support inline tags too.io).\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("table",[a("thead",[a("tr",[a("th",[a("center",[s._v("名称")])],1),s._v(" "),a("th",[a("center",[s._v("用法")])],1)])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("class")]),s._v(" "),a("td",[s._v("【可选】标识，不同的标识有不同的配色"),a("br"),s._v("（ default / primary / success / info / warning / danger ）")])]),s._v(" "),a("tr",[a("td",[s._v("no-icon")]),s._v(" "),a("td",[s._v("【可选】不显示 icon")])]),s._v(" "),a("tr",[a("td",[s._v("style")]),s._v(" "),a("td",[s._v("【可选】可以覆盖配置中的 style"),a("br"),s._v("（simple/modern/flat/disabled）")])])])]),s._v(" "),a("p",[s._v("{% note info simple %}\n一、simple\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note simple %}\n默认 提示块\n{% endnote %}\n\n{% note default simple %}\ndefault 提示块\n{% endnote %}\n\n{% note primary simple %}\nprimary 提示块\n{% endnote %}\n\n{% note success simple %}\nsuccess 提示块\n{% endnote %}\n\n{% note info simple %}\ninfo 提示块\n{% endnote %}\n\n{% note warning simple %}\nwarning 提示块\n{% endnote %}\n\n{% note danger simple %}\ndanger 提示块\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br")])]),a("p",[s._v("{% note simple %}\n默认 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note default simple %}\ndefault 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note primary simple %}\nprimary 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note success simple %}\nsuccess 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\ninfo 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note warning simple %}\nwarning 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note danger simple %}\ndanger 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n二、modern\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note modern %}\n默认 提示块\n{% endnote %}\n\n{% note default modern %}\ndefault 提示块\n{% endnote %}\n\n{% note primary modern %}\nprimary 提示块\n{% endnote %}\n\n{% note success modern %}\nsuccess 提示块\n{% endnote %}\n\n{% note info modern %}\ninfo 提示块\n{% endnote %}\n\n{% note warning modern %}\nwarning 提示块\n{% endnote %}\n\n{% note danger modern %}\ndanger 提示块\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br")])]),a("p",[s._v("{% note modern %}\n默认 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note default modern %}\ndefault 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note primary modern %}\nprimary 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note success modern %}\nsuccess 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info modern %}\ninfo 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note warning modern %}\nwarning 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note danger modern %}\ndanger 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n三、flat\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note simple %}\n默认 提示块\n{% endnote %}\n\n{% note default flat %}\ndefault 提示块\n{% endnote %}\n\n{% note primary flat %}\nprimary 提示块\n{% endnote %}\n\n{% note success flat %}\nsuccess 提示块\n{% endnote %}\n\n{% note info flat %}\ninfo 提示块\n{% endnote %}\n\n{% note warning flat %}\nwarning 提示块\n{% endnote %}\n\n{% note danger flat %}\ndanger 提示块\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br")])]),a("p",[s._v("{% note simple %}\n默认 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note default flat %}\ndefault 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note primary flat %}\nprimary 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note success flat %}\nsuccess 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info flat %}\ninfo 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note warning flat %}\nwarning 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note danger flat %}\ndanger 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n四、disabled\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note disabled %}\n默认 提示块\n{% endnote %}\n\n{% note default disabled %}\ndefault 提示块\n{% endnote %}\n\n{% note primary disabled %}\nprimary 提示块\n{% endnote %}\n\n{% note success disabled %}\nsuccess 提示块\n{% endnote %}\n\n{% note info disabled %}\ninfo 提示块\n{% endnote %}\n\n{% note warning disabled %}\nwarning 提示块\n{% endnote %}\n\n{% note danger disabled %}\ndanger 提示块\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br")])]),a("p",[s._v("{% note disabled %}\n默认 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note default disabled %}\ndefault 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note primary disabled %}\nprimary 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note success disabled %}\nsuccess 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info disabled %}\ninfo 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note warning disabled %}\nwarning 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note danger disabled %}\ndanger 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n五、no-icon\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note no-icon %}\n默认 提示块\n{% endnote %}\n\n{% note default no-icon %}\ndefault 提示块\n{% endnote %}\n\n{% note primary no-icon %}\nprimary 提示块\n{% endnote %}\n\n{% note success no-icon %}\nsuccess 提示块\n{% endnote %}\n\n{% note info no-icon %}\ninfo 提示块\n{% endnote %}\n\n{% note warning no-icon %}\nwarning 提示块\n{% endnote %}\n\n{% note danger no-icon %}\ndanger 提示块\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br")])]),a("p",[s._v("{% note no-icon %}\n默认 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note default no-icon %}\ndefault 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note primary no-icon %}\nprimary 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note success no-icon %}\nsuccess 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info no-icon %}\ninfo 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note warning no-icon %}\nwarning 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note danger no-icon %}\ndanger 提示块\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n仅3.2.0以上版本支持\n{% endnote %}")]),s._v(" "),a("p",[a("code",[s._v("默认模板")]),s._v("：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note "),a("span",{pre:!0,attrs:{class:"token url"}},[s._v("["),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("color")]),s._v("] ["),a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("icon")]),s._v("]")]),s._v(" [style] %}\nAny content (support inline tags too.io).\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("table",[a("thead",[a("tr",[a("th",[a("center",[s._v("名称")])],1),s._v(" "),a("th",[a("center",[s._v("用法")])],1)])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("class")]),s._v(" "),a("td",[s._v("【可选】标识，不同的标识有不同的配色"),a("br"),s._v("（ default / primary / success / info / warning / danger ）")])]),s._v(" "),a("tr",[a("td",[s._v("icon")]),s._v(" "),a("td",[s._v("【可选】开启icon，可配置自定义 icon (只支持 fontawesome 图标，也可以配置no-icon)")])]),s._v(" "),a("tr",[a("td",[s._v("style")]),s._v(" "),a("td",[s._v("【可选】可以覆盖配置中的 style"),a("br"),s._v("（simple/modern/flat/disabled）")])])])]),s._v(" "),a("p",[s._v("{% note info simple %}\n一、simple\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note 'fa fa-battery-empty' simple %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' simple %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' simple %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' simple%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' simple %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' simple %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' simple %}\n圣诞节快乐\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br")])]),a("p",[s._v("{% note 'fa fa-battery-empty' simple %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' simple %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' simple %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' simple%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' simple %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' simple %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' simple %}\n圣诞节快乐\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n二、modern\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note 'fa fa-battery-empty' modern %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' modern %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' modern %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' modern%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' modern %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' modern %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' modern %}\n圣诞节快乐\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br")])]),a("p",[s._v("{% note 'fa fa-battery-empty' modern %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' modern %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' modern %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' modern%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' modern %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' modern %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' modern %}\n圣诞节快乐\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n三、flat\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note 'fa fa-battery-empty' flat %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' flat %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' flat %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' flat%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' flat %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' flat %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' flat %}\n圣诞节快乐\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br")])]),a("p",[s._v("{% note 'fa fa-battery-empty' flat %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' flat %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' flat %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' flat%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' flat %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' flat %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' flat %}\n圣诞节快乐\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n四、disabled\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note 'fa fa-battery-empty' disabled %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' disabled %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' disabled %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' disabled%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' disabled %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' disabled %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' disabled %}\n圣诞节快乐\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br")])]),a("p",[s._v("{% note 'fa fa-battery-empty' disabled %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' disabled %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' disabled %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' disabled%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' disabled %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' disabled %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' disabled %}\n圣诞节快乐\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% note info simple %}\n五、no-icon\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% note 'fa fa-battery-empty' no-icon %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' no-icon %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' no-icon %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' no-icon%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' no-icon %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' no-icon %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' no-icon %}\n圣诞节快乐\n{% endnote %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br")])]),a("p",[s._v("{% note 'fa fa-battery-empty' no-icon %}\n我没电了.......\n{% endnote %}\n{% note blue 'fa fa-gift' no-icon %}\n猜猜这是什么？\n{% endnote %}\n{% note pink 'fa fa-wheelchair' no-icon %}\n小心开车 安全至上\n{% endnote %}\n{% note red 'fas fa-fan' no-icon%}\n转转转~\n{% endnote %}\n{% note orange 'fa fa-trophy' no-icon %}\nWe are chempagne!\n{% endnote %}\n{% note purple 'far fa-hand-scissors' no-icon %}\n剪刀石頭布\n{% endnote %}\n{% note green 'fa fa-tree' no-icon %}\n圣诞节快乐\n{% endnote %}")]),s._v(" "),a("p",[s._v("{% endtabs %}")]),s._v(" "),a("h4",{attrs:{id:"_2-图片放置"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_2-图片放置"}},[s._v("#")]),s._v(" 2.图片放置")]),s._v(" "),a("p",[a("strong",[s._v("可以根据图片长度自行排列")])]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% gallery %}\nmarkdown 图片格式\n{% endgallery %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[a("code",[s._v("例如")]),s._v("：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% gallery %}\n![](https://gitee.com/MoYu-zc/picgo/raw/master/img/20210208191554.jpg)\n![](https://gitee.com/MoYu-zc/picgo/raw/master/img/20210208190954.jpg)\n![](https://gitee.com/MoYu-zc/picgo/raw/master/img/20210208190913.jpeg)\n{% endgallery %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[s._v("{% gallery %}\n"),a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210208191554.jpg",alt:""}}),s._v(" "),a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210208190954.jpg",alt:""}}),s._v(" "),a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210210231945.jpeg",alt:""}})]),s._v(" "),a("p",[s._v("{% endgallery %}")]),s._v(" "),a("h4",{attrs:{id:"_3-tag-hide"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_3-tag-hide"}},[s._v("#")]),s._v(" 3.tag-hide")]),s._v(" "),a("p",[s._v("这个可以提供一个"),a("code",[s._v("按钮")]),s._v("，点击它，显示你隐藏的"),a("code",[s._v("文字")]),s._v("、"),a("code",[s._v("图片")]),s._v("等。")]),s._v(" "),a("p",[s._v("{% tabs test1 %}\n"),s._v("\n这个可以隐藏"),a("code",[s._v("文字")]),s._v("，仅限于此。( content不能包含英文逗號，可用"),a("code",[s._v("&sbquo;")]),s._v(")")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% hideInline content,display,bg,color %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br")])]),a("ul",[a("li",[a("p",[s._v("content: 文本內容")])]),s._v(" "),a("li",[a("p",[s._v("display: 按钮显示的文字(可选)")])]),s._v(" "),a("li",[a("p",[s._v("bg: 按钮的背景颜色(可选)")])]),s._v(" "),a("li",[a("p",[s._v("color: 按钮文字的颜色(可选)")])])]),s._v(" "),a("p",[s._v("{% note info simple %}\nDemo\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("座右铭座右铭！！ {% hideInline 何其荣幸 何德何能,别点我,#FF7242,#fff %}\n\n平平无奇。。。  {% hideInline 上面太花里胡哨了,上面真秀 %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[s._v("座右铭座右铭！！ {% hideInline 何其荣幸 何德何能,别点我,#FF7242,#fff %}")]),s._v(" "),a("p",[s._v("平平无奇。。。  {% hideInline 上面太花里胡哨了,上面真秀 %}")]),s._v(" "),a("p",[s._v("这个也是提供一个"),a("code",[s._v("按钮")]),s._v("，而他可以隐藏"),a("code",[s._v("文字")]),s._v("、"),a("code",[s._v("图片")]),s._v("、"),a("code",[s._v("代码块")]),s._v("等。( dispaly不能包含英文逗號，可用"),a("code",[s._v("&sbquo;")]),s._v(")")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% hideBlock display,bg,color %}\ncontent\n{% endhideBlock %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("ul",[a("li",[a("p",[s._v("content: 文本內容")])]),s._v(" "),a("li",[a("p",[s._v("display: 按钮显示的文字(可选)")])]),s._v(" "),a("li",[a("p",[s._v("bg: 按钮的背景颜色(可选)")])]),s._v(" "),a("li",[a("p",[s._v("color: 按钮文字的颜色(可选)")])])]),s._v(" "),a("p",[s._v("{% note info simple %}\nDemo\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("座右铭座右铭！！ \n{% hideBlock  别点我,#FF7242,#fff %}\n何其荣幸 何德何能\n{% endhideBlock %}\n平平无奇。。。  \n{% hideBlock 上面真秀 %}\n 上面太花里胡哨了\n{% endhideBlock %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br")])]),a("p",[s._v("座右铭座右铭！！\n{% hideBlock  别点我,#FF7242,#fff %}\n何其荣幸 何德何能\n{% endhideBlock %}\n平平无奇。。。"),a("br"),s._v("\n{% hideBlock 上面真秀 %}\n上面太花里胡哨了\n{% endhideBlock %}")]),s._v(" "),a("p",[s._v("如果你需要展示的"),a("code",[s._v("內容太多")]),s._v("，可以把它"),a("code",[s._v("隐藏")]),s._v("在收缩框里，需要时再把它"),a("code",[s._v("展开")]),s._v("。")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% hideToggle display,bg,color %}\ncontent\n{% endhideToggle %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[s._v("{% note info simple %}\nDemo\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% hideToggle Wecome to my Blog %}\n 欢迎欢迎欢迎\n MoYu‘s Blog\n Gitee：https://moyu-zc.gitee.io/\n Github：https://moyu-zc.github.io/\n{% endhideToggle %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br")])]),a("p",[s._v("{% hideToggle Wecome to my Blog %}\n欢迎欢迎欢迎\nMoYu‘s Blog\nGitee：https://moyu-zc.gitee.io/\nGithub：https://moyu-zc.github.io/\n{% endhideToggle %}")]),s._v(" "),a("p",[s._v("{% endtabs %}")]),s._v(" "),a("h4",{attrs:{id:"_4-mermaid"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_4-mermaid"}},[s._v("#")]),s._v(" 4.mermaid")]),s._v(" "),a("p",[s._v("{% note warning flat %}\nmermaid标签不允许嵌套于一些隐藏属性的标签外挂")]),s._v(" "),a("p",[s._v("例如: tag-hide內的标签外挂和tabs标签外挂，也不能压缩代码")]),s._v(" "),a("p",[s._v("这会导致mermaid图示无法正常显示，使用时请留意。\n{% endnote %}\n使用mermaid标签可以绘制"),a("code",[s._v("Flowchart（流程图）")]),s._v("、"),a("code",[s._v("Sequence diagram（时序图 ）")]),s._v("、"),a("code",[s._v("Class Diagram（类别图）")]),s._v("、"),a("code",[s._v("State Diagram（状态图）")]),s._v("、"),a("code",[s._v("Gantt（甘特图）")]),s._v("和"),a("code",[s._v("Pie Chart（圆形图）")]),s._v("，具体可以查看"),a("a",{attrs:{href:"https://mermaid-js.github.io/mermaid/#/",target:"_blank",rel:"noopener noreferrer"}},[s._v("mermaid文檔"),a("OutboundLink")],1),s._v("\n在"),a("code",[s._v("\\source\\_data")]),s._v("中的"),a("code",[s._v("butterfly.yml")]),s._v("中修改:")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("mermaid")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# built-in themes: default/forest/dark/neutral")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("theme")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" default\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("p",[a("code",[s._v("写法")]),s._v("：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% mermaid %}\n內容\n{% endmermaid %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[s._v("{% note info simple %}\nDemo\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v('{% mermaid %}\npie\n   Test X\n    "A" : 50\n    "B" : 20\n    "C" : 10\n    "D" :  5\n{% endmermaid %}\n')])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br")])]),a("p",[s._v('{% mermaid %}\npie\nTest X\n"A" : 50\n"B" : 20\n"C" : 10\n"D" :  5\n{% endmermaid %}')]),s._v(" "),a("h4",{attrs:{id:"_5-tabs"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_5-tabs"}},[s._v("#")]),s._v(" 5.Tabs")]),s._v(" "),a("p",[s._v("这个功能比较麻烦：")]),s._v(" "),a("p",[a("strong",[s._v("创建 tabs.styl")])]),s._v(" "),a("p",[s._v("路径："),a("strong",[s._v("主题目录 /source/css/_layout/tabs.styl")])]),s._v(" "),a("div",{staticClass:"language-stylus line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-stylus"}},[a("code",[a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(".tabs")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("margin")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("rem")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(".tabs"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("\n.tabs-comment")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" block"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("padding-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("10")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("position")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" relative"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("ul.nav-tabs ")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" flex"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("flex-wrap")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" wrap"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("margin")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("margin-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("-1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("padding")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n    +"),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("mobile-smallest")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" block"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("margin-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("5")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("  ")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("li.tab ")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-left")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-right")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("3")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("flex-grow")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("list-style-type")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      +"),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("mobile-smallest")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-left")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("3")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-right")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" $tbr $tbr "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      +"),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("mobile-smallest")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" $tbr"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token statement"}},[a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("if")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("hexo-config"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'tabs.transition.tabs'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("the-transition-ease-out")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("a ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" initial"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" block"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("line-height")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1.8")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("outline")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("padding")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v(".25")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("em")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v(".75")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("em")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("text-align")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" center"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("i ")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("width")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("18")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("em")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("/")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("14")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token statement"}},[a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("if")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("hexo-config"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'tabs.transition.labels'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("the-transition-ease-out")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("&.active ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid "),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("transparent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-left")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-right")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("3")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("orange")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n\n        +"),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("mobile-smallest")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-bottom")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-left")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("3")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("orange")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-right")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("a ")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("color")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("var")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("-")]),s._v("-link-color"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])])]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("cursor")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" default"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(".tab-content ")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v(".tab-pane ")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" solid $light-"),a("span",{pre:!0,attrs:{class:"token color"}},[s._v("grey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-top")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("padding")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("20")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("20")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("20")]),a("span",{pre:!0,attrs:{class:"token unit"}},[s._v("px")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" $tbr"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("&:not(.active) ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" none"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("&.active ")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("display")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" block"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token selector"}},[s._v("&:nth-of-type(1) ")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" $tbr $tbr $tbr"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n          +"),a("span",{pre:!0,attrs:{class:"token func"}},[a("span",{pre:!0,attrs:{class:"token function"}},[s._v("mobile-smallest")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" ")]),s._v("\n            "),a("span",{pre:!0,attrs:{class:"token property-declaration"}},[a("span",{pre:!0,attrs:{class:"token property"}},[s._v("border-radius")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" $tbr"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("  ")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br"),a("span",{staticClass:"line-number"},[s._v("28")]),a("br"),a("span",{staticClass:"line-number"},[s._v("29")]),a("br"),a("span",{staticClass:"line-number"},[s._v("30")]),a("br"),a("span",{staticClass:"line-number"},[s._v("31")]),a("br"),a("span",{staticClass:"line-number"},[s._v("32")]),a("br"),a("span",{staticClass:"line-number"},[s._v("33")]),a("br"),a("span",{staticClass:"line-number"},[s._v("34")]),a("br"),a("span",{staticClass:"line-number"},[s._v("35")]),a("br"),a("span",{staticClass:"line-number"},[s._v("36")]),a("br"),a("span",{staticClass:"line-number"},[s._v("37")]),a("br"),a("span",{staticClass:"line-number"},[s._v("38")]),a("br"),a("span",{staticClass:"line-number"},[s._v("39")]),a("br"),a("span",{staticClass:"line-number"},[s._v("40")]),a("br"),a("span",{staticClass:"line-number"},[s._v("41")]),a("br"),a("span",{staticClass:"line-number"},[s._v("42")]),a("br"),a("span",{staticClass:"line-number"},[s._v("43")]),a("br"),a("span",{staticClass:"line-number"},[s._v("44")]),a("br"),a("span",{staticClass:"line-number"},[s._v("45")]),a("br"),a("span",{staticClass:"line-number"},[s._v("46")]),a("br"),a("span",{staticClass:"line-number"},[s._v("47")]),a("br"),a("span",{staticClass:"line-number"},[s._v("48")]),a("br"),a("span",{staticClass:"line-number"},[s._v("49")]),a("br"),a("span",{staticClass:"line-number"},[s._v("50")]),a("br"),a("span",{staticClass:"line-number"},[s._v("51")]),a("br"),a("span",{staticClass:"line-number"},[s._v("52")]),a("br"),a("span",{staticClass:"line-number"},[s._v("53")]),a("br"),a("span",{staticClass:"line-number"},[s._v("54")]),a("br"),a("span",{staticClass:"line-number"},[s._v("55")]),a("br"),a("span",{staticClass:"line-number"},[s._v("56")]),a("br"),a("span",{staticClass:"line-number"},[s._v("57")]),a("br"),a("span",{staticClass:"line-number"},[s._v("58")]),a("br"),a("span",{staticClass:"line-number"},[s._v("59")]),a("br"),a("span",{staticClass:"line-number"},[s._v("60")]),a("br"),a("span",{staticClass:"line-number"},[s._v("61")]),a("br"),a("span",{staticClass:"line-number"},[s._v("62")]),a("br"),a("span",{staticClass:"line-number"},[s._v("63")]),a("br"),a("span",{staticClass:"line-number"},[s._v("64")]),a("br"),a("span",{staticClass:"line-number"},[s._v("65")]),a("br"),a("span",{staticClass:"line-number"},[s._v("66")]),a("br"),a("span",{staticClass:"line-number"},[s._v("67")]),a("br"),a("span",{staticClass:"line-number"},[s._v("68")]),a("br"),a("span",{staticClass:"line-number"},[s._v("69")]),a("br"),a("span",{staticClass:"line-number"},[s._v("70")]),a("br"),a("span",{staticClass:"line-number"},[s._v("71")]),a("br"),a("span",{staticClass:"line-number"},[s._v("72")]),a("br")])]),a("p",[a("strong",[s._v("tabs.js 有的话不用管，没有就创建")])]),s._v(" "),a("p",[s._v("路径："),a("strong",[s._v("主题目录 /scripts/tags/tabs.js")])]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/**\n * tabs.js | https://theme-next.org/docs/tag-plugins/tabs\n */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("/* global hexo */")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'use strict'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("function")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("postTabs")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token parameter"}},[s._v("args"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" content")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabBlock "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token regex"}},[a("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[s._v("/")]),a("span",{pre:!0,attrs:{class:"token regex-source language-regex"}},[s._v("\x3c!--\\s*tab (.*?)\\s*--\x3e\\n([\\w\\W\\s\\S]*?)\x3c!--\\s*endtab\\s*--\x3e")]),a("span",{pre:!0,attrs:{class:"token regex-delimiter"}},[s._v("/")]),a("span",{pre:!0,attrs:{class:"token regex-flags"}},[s._v("g")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  args "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" args"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("join")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' '")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("split")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("','")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabName "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" args"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabActive "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("Number")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("args"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("||")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" matches "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" match"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabId "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabNav "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabContent "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("!")]),s._v("tabName "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" hexo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("log"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("warn")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'Tabs block must have unique name!'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("while")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("match "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" tabBlock"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("exec")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("content"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("!==")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("null")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    matches"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("push")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("match"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    matches"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("push")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("match"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("2")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("for")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" i "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v(" i "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("<")]),s._v(" matches"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("length"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v(" i "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("2")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabParameters "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" matches"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),s._v("i"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("split")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'@'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" postContent   "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" matches"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),s._v("i "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabCaption    "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" tabParameters"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("||")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabIcon       "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" tabParameters"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("||")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tabHref       "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    postContent "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" hexo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("render"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("renderSync")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("text"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" postContent"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" engine"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'markdown'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("trim")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    tabId "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    tabHref "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabName "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' '")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" tabId"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("toLowerCase")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("split")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' '")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("join")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'-'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabCaption"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("length "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("===")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabIcon"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("length "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("===")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabCaption "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" tabName "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' '")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" tabId"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" isOnlyicon "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" tabIcon"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("length "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(">")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" tabCaption"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("length "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("===")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("?")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' style=\"text-align: center;\"'")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    tabIcon"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("length "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(">")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabIcon "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token template-string"}},[a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('<i class="fa fa-')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabIcon"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("trim")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("isOnlyicon"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("></i>")]),a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" isActive "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabActive "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(">")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" tabActive "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("===")]),s._v(" tabId"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("||")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("tabActive "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("===")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("&&")]),s._v(" tabId "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("===")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("1")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("?")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' active'")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    tabNav "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token template-string"}},[a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('<li class="tab')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("isActive"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('"><a href="#')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabHref"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('">')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabIcon "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" tabCaption"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("trim")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("</a></li>")]),a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    tabContent "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token template-string"}},[a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('<div class="tab-pane')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("isActive"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('" id="')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabHref"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('">')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("postContent"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("</div>")]),a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n  tabNav "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token template-string"}},[a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('<ul class="nav-tabs">')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabNav"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("</ul>")]),a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  tabContent "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token template-string"}},[a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('<div class="tab-content">')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabContent"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("</div>")]),a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("return")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token template-string"}},[a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('<div class="tabs" id="')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabName"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("toLowerCase")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("split")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("' '")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("join")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'-'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v('">')]),a("span",{pre:!0,attrs:{class:"token interpolation"}},[a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("${")]),s._v("tabNav "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("+")]),s._v(" tabContent"),a("span",{pre:!0,attrs:{class:"token interpolation-punctuation punctuation"}},[s._v("}")])]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("</div>")]),a("span",{pre:!0,attrs:{class:"token template-punctuation string"}},[s._v("`")])]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\nhexo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("extend"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("tag"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("register")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'tabs'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" postTabs"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("ends"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean"}},[s._v("true")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\nhexo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("extend"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("tag"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("register")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'subtabs'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" postTabs"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("ends"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean"}},[s._v("true")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\nhexo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("extend"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("tag"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("register")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'subsubtabs'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" postTabs"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("ends"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean"}},[s._v("true")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br"),a("span",{staticClass:"line-number"},[s._v("28")]),a("br"),a("span",{staticClass:"line-number"},[s._v("29")]),a("br"),a("span",{staticClass:"line-number"},[s._v("30")]),a("br"),a("span",{staticClass:"line-number"},[s._v("31")]),a("br"),a("span",{staticClass:"line-number"},[s._v("32")]),a("br"),a("span",{staticClass:"line-number"},[s._v("33")]),a("br"),a("span",{staticClass:"line-number"},[s._v("34")]),a("br"),a("span",{staticClass:"line-number"},[s._v("35")]),a("br"),a("span",{staticClass:"line-number"},[s._v("36")]),a("br"),a("span",{staticClass:"line-number"},[s._v("37")]),a("br"),a("span",{staticClass:"line-number"},[s._v("38")]),a("br"),a("span",{staticClass:"line-number"},[s._v("39")]),a("br"),a("span",{staticClass:"line-number"},[s._v("40")]),a("br"),a("span",{staticClass:"line-number"},[s._v("41")]),a("br"),a("span",{staticClass:"line-number"},[s._v("42")]),a("br"),a("span",{staticClass:"line-number"},[s._v("43")]),a("br")])]),a("p",[a("strong",[s._v("在 main.js 添加事件")])]),s._v(" "),a("p",[s._v("路径："),a("strong",[s._v("主题目录 /source/js/main.js")])]),s._v(" "),a("div",{staticClass:"language-js line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("//下面这句源文件有，搜索即可")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("if")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token constant"}},[s._v("GLOBAL_CONFIG")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("isPhotoFigcaption"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addPhotoFigcaption")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("//添加如下：")]),s._v("\ndocument"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("querySelectorAll")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'.tabs ul.nav-tabs .tab'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("forEach")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token parameter"}},[s._v("element")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=>")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n      element"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("addEventListener")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'click'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token parameter"}},[s._v("event")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=>")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n        event"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("preventDefault")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" target "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" event"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("currentTarget"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("// Prevent selected tab to select again.")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("if")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("!")]),s._v("target"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("classList"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("contains")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'active'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("// Add & Remove active class on `nav-tabs` & `tab-content`.")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("...")]),s._v("target"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("parentNode"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("children"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("forEach")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token parameter"}},[s._v("element")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=>")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n            element"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("classList"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("remove")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'active'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          target"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("classList"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("add")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'active'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("var")]),s._v(" tActive "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" document"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("getElementById")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),s._v("target"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("querySelector")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'a'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("getAttribute")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'href'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("replace")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'#'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("''")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("[")]),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("...")]),s._v("tActive"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("parentNode"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("children"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("]")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("forEach")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token parameter"}},[s._v("element")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=>")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n            element"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("classList"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("remove")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'active'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          tActive"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),s._v("classList"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("add")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'active'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("// Trigger event")]),s._v("\n          tActive"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("dispatchEvent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("Event")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'tabs:click'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("{")]),s._v("\n            bubbles"),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean"}},[s._v("true")]),s._v("\n          "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n        "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),s._v("\n      "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("}")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n\n    window"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(".")]),a("span",{pre:!0,attrs:{class:"token function"}},[s._v("dispatchEvent")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token keyword"}},[s._v("new")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token class-name"}},[s._v("Event")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("(")]),a("span",{pre:!0,attrs:{class:"token string"}},[s._v("'tabs:register'")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(")")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br"),a("span",{staticClass:"line-number"},[s._v("17")]),a("br"),a("span",{staticClass:"line-number"},[s._v("18")]),a("br"),a("span",{staticClass:"line-number"},[s._v("19")]),a("br"),a("span",{staticClass:"line-number"},[s._v("20")]),a("br"),a("span",{staticClass:"line-number"},[s._v("21")]),a("br"),a("span",{staticClass:"line-number"},[s._v("22")]),a("br"),a("span",{staticClass:"line-number"},[s._v("23")]),a("br"),a("span",{staticClass:"line-number"},[s._v("24")]),a("br"),a("span",{staticClass:"line-number"},[s._v("25")]),a("br"),a("span",{staticClass:"line-number"},[s._v("26")]),a("br"),a("span",{staticClass:"line-number"},[s._v("27")]),a("br"),a("span",{staticClass:"line-number"},[s._v("28")]),a("br")])]),a("p",[a("strong",[s._v("在 var.styl 添加样式")])]),s._v(" "),a("p",[s._v("路径："),a("strong",[s._v("主题目录 /source/css/var.styl")])]),s._v(" "),a("div",{staticClass:"language-stylus line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-stylus"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("//查找 light-grey")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token variable-declaration"}},[a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("$light-grey")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token hexcode"}},[s._v("#EEEEEE")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token variable-declaration"}},[a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("$tbr")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("0")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token variable-declaration"}},[a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("$orange")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token operator"}},[s._v("=")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token hexcode"}},[s._v("#fc6423")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(";")])]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br")])]),a("p",[a("strong",[s._v("在 主题配置文件 添加配置")])]),s._v(" "),a("p",[s._v("路径："),a("strong",[s._v("主目录 /source/_data/Butterfly.yml")])]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Tabs tag")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("tabs")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("transition")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("tabs")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n    "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("labels")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[s._v("{% note info simple %}\nDemo1------"),a("code",[s._v("默认")]),s._v("方式\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% tabs test1 %}\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 1.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 2.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 3.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n{% endtabs %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br")])]),a("p",[s._v("{% tabs test1 %}\n"),s._v(" "),a("strong",[s._v("This is Tab 1.")])]),s._v(" "),a("p",[a("strong",[s._v("This is Tab 2.")])]),s._v(" "),a("p",[a("strong",[s._v("This is Tab 3.")]),s._v(" "),s._v("\n{% endtabs %}")]),s._v(" "),a("p",[s._v("{% note danger %}\nDemo2------预设选择"),a("code",[s._v("tabs")]),s._v("\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% tabs test2, 3 %}\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 1.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 2.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 3.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n{% endtabs %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br")])]),a("p",[s._v("{% tabs test2, 3 %}\n"),s._v(" "),a("strong",[s._v("This is Tab 1.")])]),s._v(" "),a("p",[a("strong",[s._v("This is Tab 2.")])]),s._v(" "),a("p",[a("strong",[s._v("This is Tab 3.")]),s._v(" "),s._v("\n{% endtabs %}")]),s._v(" "),a("p",[s._v("{% note danger %}\nDemo3------没有预设\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% tabs test3, -1 %}\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 1.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 2.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("This is Tab 3.")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n{% endtabs %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br")])]),a("p",[s._v("{% tabs test3, -1 %}\n"),s._v(" "),a("strong",[s._v("This is Tab 1.")])]),s._v(" "),a("p",[a("strong",[s._v("This is Tab 2.")])]),s._v(" "),a("p",[a("strong",[s._v("This is Tab 3.")]),s._v(" "),s._v("\n{% endtabs %}")]),s._v(" "),a("p",[s._v("{% note danger %}\nDemo4------自定义Tab名、 只有icon、icon和Tab名\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% tabs test4 %}\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab 第一個Tab --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("tab名字为第一个Tab")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab @fab fa-bell --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("只有图标 没有Tab名字")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- tab 身份证@fas fa-address-card --\x3e")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token bold"}},[a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")]),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("名字+icon")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("**")])]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("\x3c!-- endtab --\x3e")]),s._v("\n{% endtabs %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br")])]),a("p",[s._v("{% tabs test4 %}\n"),s._v(" "),a("strong",[s._v("tab名字为第一个Tab")])]),s._v(" "),a("p",[a("strong",[s._v("只有图标 没有Tab名字")])]),s._v(" "),a("p",[a("strong",[s._v("名字+icon")]),s._v(" "),s._v("\n{% endtabs %}")]),s._v(" "),a("h4",{attrs:{id:"_6-button"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#_6-button"}},[s._v("#")]),s._v(" 6.Button")]),s._v(" "),a("p",[a("code",[s._v("模板")]),s._v("：")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% btn [url],[text],[icon],"),a("span",{pre:!0,attrs:{class:"token url"}},[s._v("["),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("color")]),s._v("] ["),a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("style")]),s._v("]")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token url"}},[s._v("["),a("span",{pre:!0,attrs:{class:"token content"}},[s._v("layout")]),s._v("] ["),a("span",{pre:!0,attrs:{class:"token variable"}},[s._v("position")]),s._v("]")]),s._v(" [size] %}\n\n[url]         : 链接\n[text]        : 按钮文字\n[icon]        : [可选] 图标\n[color]       : [可选] 按钮背景颜色(默认style时）\n                      按鈕字體和邊框顔色(outline時)\n                      default/blue/pink/red/purple/orange/green\n[style]       : [可选] 按钮样式 默认实心\n                      outline/留空\n[layout]      : [可选] 按钮布局 默认为line\n                      block/留空\n[position]    : [可选] 按钮位置 前提是设置了layout為block 默认为左边\n                      center/right/留空\n[size]        : [可选] 按钮大小\n                      larger/留空\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br")])]),a("p",[s._v("{% note danger %}\nDemo\n{% endnote %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("This is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,,outline %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,larger %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("p",[s._v("This is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,outline %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline %}\nThis is my website, click the button {% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,larger %}")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,block %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,block center larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,block right outline larger %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[s._v("{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,block %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,block center larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,block right outline larger %}\n"),a("code",[s._v("More styles")]),s._v(":")]),s._v(" "),a("div",{staticClass:"language-markdown line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-markdown"}},[a("code",[s._v("{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,blue larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,pink larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,red larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline purple larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline orange larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline green larger %}\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br")])]),a("p",[s._v("{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,blue larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,pink larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,red larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline purple larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline orange larger %}\n{% btn 'https://moyu-zc.gitee.io/',MoYu,far fa-hand-point-right,outline green larger %}")]),s._v(" "),a("h3",{attrs:{id:"分享功能"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#分享功能"}},[s._v("#")]),s._v(" 分享功能")]),s._v(" "),a("p",[s._v("{% tabs test11 %}")]),s._v(" "),a("p",[s._v("如果你不知道 "),a("a",{attrs:{href:"https://github.com/overtrue/share.js/",target:"_blank",rel:"noopener noreferrer"}},[s._v("sharejs"),a("OutboundLink")],1),s._v("，可以查看说明")]),s._v(" "),a("p",[s._v("主目录下"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v("中修改:")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("sharejs")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("sites")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" facebook"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("twitter"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("wechat"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("weibo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("qq  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#想要显示的內容")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("p",[a("img",{attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220438.png",alt:"35"}})]),s._v(" "),a("p",[s._v("如果你不知道"),a("a",{attrs:{href:"https://www.addtoany.com/",target:"_blank",rel:"noopener noreferrer"}},[s._v("addtoany"),a("OutboundLink")],1),s._v("，可以查看说明")]),s._v(" "),a("p",[s._v("主目录下"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v("中修改:")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("addtoany")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("item")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" facebook"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("twitter"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("wechat"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("sina_weibo"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("facebook_messenger"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("email"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("copy_link\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220451.png",alt:"36"}}),s._v(" "),a("p",[s._v("{% endtabs %}")]),s._v(" "),a("h3",{attrs:{id:"在线聊天"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#在线聊天"}},[s._v("#")]),s._v(" 在线聊天")]),s._v(" "),a("p",[s._v("{% tabs test111 %}")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("butterfly")]),s._v("中，有几种内置的在线聊天工具。")]),s._v(" "),a("p",[s._v("简单的，打开"),a("code",[s._v("chat_btn")]),s._v("，在右下角开启小按钮。")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# Chat Button [recommend]")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# It will create a button in the bottom right corner of website, and hide the origin button")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("chat_btn")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br")])]),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220456.png",alt:"37"}}),s._v(" "),a("p",[s._v("为了不影响"),a("code",[s._v("访客体验")]),s._v("，可以开启"),a("code",[s._v("chat_hide_show")]),s._v("，开启后，只有"),a("code",[s._v("向上")]),s._v("滚动才会显示"),a("code",[s._v("聊天按钮")]),s._v("，"),a("code",[s._v("向下")]),s._v("滚动时会"),a("code",[s._v("隐藏按钮")]),s._v("。")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# The origin chat button is displayed when scrolling up, and the button is hidden when scrolling down")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("chat_hide_show")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br")])]),a("p",[s._v("如果使用工具自带的聊天按钮，位置可能会遮挡右下角图标，可以配置"),a("code",[s._v("rightside-bottom")]),s._v("调整右下角图标位置")]),s._v(" "),a("p",[s._v("在"),a("a",{attrs:{href:"https://chatra.com/cn/",target:"_blank",rel:"noopener noreferrer"}},[s._v("chatra"),a("OutboundLink")],1),s._v("中"),a("code",[s._v("注册")]),s._v("账号.")]),s._v(" "),a("p",[s._v("可以在"),a("code",[s._v("Preferences")]),s._v("中找到"),a("code",[s._v("Public key")])]),s._v(" "),a("img",{staticStyle:{zoom:"75%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220504.png",alt:"38"}}),s._v(" "),a("p",[s._v("之后"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v("中修改:")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# chatra")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# https://chatra.io/")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("chatra")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("id")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("           "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#这个就是Public key")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),s._v(" "),a("p",[s._v("在"),a("a",{attrs:{href:"https://www.tidio.com/",target:"_blank",rel:"noopener noreferrer"}},[s._v("tidio"),a("OutboundLink")],1),s._v("中"),a("code",[s._v("注册")]),s._v("账号。")]),s._v(" "),a("p",[s._v("可以在"),a("code",[s._v("Preferences")]),s._v("中找到"),a("code",[s._v("Public key")]),s._v("。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("设置")]),s._v("中还可以设置"),a("code",[s._v("样式")]),s._v("。")]),s._v(" "),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220510.png",alt:"39"}}),s._v(" "),a("p",[s._v("之后"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v("中修改:")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# tidio")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# https://www.tidio.com/")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("tidio")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("public_key")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("    "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#这个就是Public key")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220515.png",alt:"40"}}),s._v(" "),a("p",[s._v("在"),a("code",[s._v("daovoice")]),s._v("中注册。")]),s._v(" "),a("p",[s._v("在"),a("code",[s._v("应用设置")]),s._v("----"),a("code",[s._v("安装到网站")]),s._v("   之中的"),a("code",[s._v("app id")])]),s._v(" "),a("p",[s._v("可在聊天设置里可以配置"),a("code",[s._v("聊天按钮")]),s._v("等样式")]),s._v(" "),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220520.png",alt:"41"}}),s._v(" "),a("p",[s._v("之后"),a("code",[s._v("/source/_data")]),s._v("--"),a("code",[s._v("butterfly.yml")]),s._v("中修改:")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# daovoice")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# http://daovoice.io/")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("daovoice")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("app_id")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("      "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#这个就是app id")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220527.png",alt:"42"}}),s._v(" "),a("p",[s._v("在"),a("a",{attrs:{href:"https://gitter.im/",target:"_blank",rel:"noopener noreferrer"}},[s._v("gitter"),a("OutboundLink")],1),s._v("中登录上账号。")]),s._v(" "),a("p",[s._v("创建一個"),a("code",[s._v("community")]),s._v("或者"),a("code",[s._v("room")]),s._v(",复制名称到设置去。")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# gitter")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# https://gitter.im/")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("gitter")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("room")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" MoYuzc/community   "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#名称放这儿")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220537.png",alt:"43"}}),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220541.png",alt:"44"}}),s._v(" "),a("p",[s._v("打开"),a("a",{attrs:{href:"https://crisp.chat/en/",target:"_blank",rel:"noopener noreferrer"}},[s._v("crisp"),a("OutboundLink")],1),s._v("，注册账号。")]),s._v(" "),a("p",[s._v("在设置中，找到"),a("code",[s._v("网站ID")]),s._v("。")]),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220549.png",alt:"45"}}),s._v(" "),a("p",[s._v("之后，在"),a("code",[s._v("butterflt.yml")]),s._v("中修改：")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# crisp")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# https://crisp.chat/en/")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("crisp")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enable")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("website_id")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("    "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#网站ID填写这儿")]),s._v("\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br")])]),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220553.png",alt:"46"}}),s._v(" "),a("p",[s._v("{% endtabs %}")]),s._v(" "),a("h3",{attrs:{id:"评论功能"}},[a("a",{staticClass:"header-anchor",attrs:{href:"#评论功能"}},[s._v("#")]),s._v(" 评论功能")]),s._v(" "),a("p",[s._v("开启评论需要在"),a("code",[s._v("butterfly.yml")]),s._v("---"),a("code",[s._v("comments")]),s._v("---"),a("code",[s._v("use")]),s._v("中填写你需要的评论。")]),s._v(" "),a("p",[s._v("支持"),a("code",[s._v("双评论显示")]),s._v("，只需要配置两个评论（第一个为"),a("code",[s._v("默认")]),s._v("显示）")]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("comments")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("use")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n   "),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v(" Valine\n  "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# - Disqus    ")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("text")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("lazyload")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("count")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("false")]),s._v(" \n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br")])]),a("table",[a("thead",[a("tr",[a("th",[s._v("参数")]),s._v(" "),a("th",[s._v("解释")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("use")]),s._v(" "),a("td",[s._v("使用的评论（填写的评论首字母需要大写。最多支持两个，不需要就留空）")])]),s._v(" "),a("tr",[a("td",[s._v("text")]),s._v(" "),a("td",[s._v("是否显示评论服务商的名字")])]),s._v(" "),a("tr",[a("td",[s._v("lazyload")]),s._v(" "),a("td",[s._v("是否为评论开启lazyload，开启后，只有滚动到评论位置时才会加载评论所需要的资源（开启lazyload后，评论数将不显示）")])]),s._v(" "),a("tr",[a("td",[s._v("count")]),s._v(" "),a("td",[s._v("是否在文章顶部显示评论数"),a("br"),s._v("livere 和 utterances 不支持评论数显示")])])])]),s._v(" "),a("p",[a("code",[s._v("注意")]),s._v("：双评论不能是"),a("code",[s._v("Disqus")]),s._v(" 和"),a("code",[s._v("Disqusjs")]),s._v(" 一起，由于其共用同一个 "),a("code",[s._v("ID")]),s._v("，会出错。")]),s._v(" "),a("p",[s._v("以下是举例的我在用的："),a("code",[s._v("Valine")])]),s._v(" "),a("p",[s._v("1.在"),a("a",{attrs:{href:"https://leancloud.cn/dashboard/login.html#/signin",target:"_blank",rel:"noopener noreferrer"}},[s._v("LeanCloud"),a("OutboundLink")],1),s._v("中注册账号，并进入。")]),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220747.png",alt:"47"}}),s._v(" "),a("p",[s._v("2."),a("code",[s._v("创建应用")]),s._v("，命名就随便啦")]),s._v(" "),a("img",{staticStyle:{zoom:"50%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220754.png",alt:"48"}}),s._v(" "),a("p",[s._v("3.创建成功后，进入"),a("code",[s._v("设置")])]),s._v(" "),a("img",{staticStyle:{zoom:"75%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220806.png",alt:"49"}}),s._v(" "),a("p",[s._v("4.进入"),a("code",[s._v("应用Keys")])]),s._v(" "),a("p",[a("code",[s._v("应用Keys")]),s._v("中有"),a("code",[s._v("AppID")]),s._v("和"),a("code",[s._v("AppKey")]),s._v("，这两个需要填写到你的"),a("code",[s._v("butterfly.yml")]),s._v("中")]),s._v(" "),a("img",{staticStyle:{zoom:"80%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220813.png",alt:"50"}}),s._v(" "),a("p",[s._v("5.填写"),a("code",[s._v("butterfly.yml")])]),s._v(" "),a("div",{staticClass:"language-yaml line-numbers-mode"},[a("pre",{pre:!0,attrs:{class:"language-yaml"}},[a("code",[a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# valine")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# https://valine.js.org")]),s._v("\n"),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("valine")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("appId")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("              "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("#  app id")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("appKey")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v("              "),a("span",{pre:!0,attrs:{class:"token comment"}},[s._v("# app key")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("pageSize")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token number"}},[s._v("10")]),s._v("\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("avatar")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" monsterid \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("lang")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" zh"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v("-")]),s._v("CN \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("placeholder")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" Please leave your footprints p\n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("guest_info")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" nick"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("mail"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("link \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("recordIP")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("serverURLs")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("bg")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("emojiCDN")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("enableQQ")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" "),a("span",{pre:!0,attrs:{class:"token boolean important"}},[s._v("true")]),s._v(" \n  "),a("span",{pre:!0,attrs:{class:"token key atrule"}},[s._v("requiredFields")]),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(":")]),s._v(" nick"),a("span",{pre:!0,attrs:{class:"token punctuation"}},[s._v(",")]),s._v("mail\n")])]),s._v(" "),a("div",{staticClass:"line-numbers-wrapper"},[a("span",{staticClass:"line-number"},[s._v("1")]),a("br"),a("span",{staticClass:"line-number"},[s._v("2")]),a("br"),a("span",{staticClass:"line-number"},[s._v("3")]),a("br"),a("span",{staticClass:"line-number"},[s._v("4")]),a("br"),a("span",{staticClass:"line-number"},[s._v("5")]),a("br"),a("span",{staticClass:"line-number"},[s._v("6")]),a("br"),a("span",{staticClass:"line-number"},[s._v("7")]),a("br"),a("span",{staticClass:"line-number"},[s._v("8")]),a("br"),a("span",{staticClass:"line-number"},[s._v("9")]),a("br"),a("span",{staticClass:"line-number"},[s._v("10")]),a("br"),a("span",{staticClass:"line-number"},[s._v("11")]),a("br"),a("span",{staticClass:"line-number"},[s._v("12")]),a("br"),a("span",{staticClass:"line-number"},[s._v("13")]),a("br"),a("span",{staticClass:"line-number"},[s._v("14")]),a("br"),a("span",{staticClass:"line-number"},[s._v("15")]),a("br"),a("span",{staticClass:"line-number"},[s._v("16")]),a("br")])]),a("img",{staticStyle:{zoom:"67%"},attrs:{src:"https://gitee.com/MoYu-zc/picgo/raw/master/img/20210206220913.png",alt:"52"}}),s._v(" "),a("p",[s._v("​\t\t\t\t持续更新ing~~")])])}),[],!1,null,null,null);t.default=e.exports}}]);