Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

hexo-butterfly-envelope

Akilarlxh2.4kApache-2.01.0.15

A commentsbar beautify plugin for theme-butterfly

hexo, renderer, envelop, butterfly, theme-butterfly, plugins

readme

hexo-butterfly-envelope

hexo-theme-butterfly添加 信封样式留言板

安装

  1. 安装插件,在博客根目录[Blogroot]下打开终端,运行以下指令:

    npm install hexo-butterfly-envelope --save
  2. 添加配置信息,以下为写法示例 在站点配置文件_config.yml或者主题配置文件_config.butterfly.yml中添加

     # envelope_comment
     # see https://akilar.top/posts/e2d3c450/
     envelope_comment:
       enable: true #控制开关
       custom_pic:      
         cover: https://unpkg.zhimg.com/hexo-butterfly-envelope/lib/violet.jpg #信笺头部图片
         line: https://unpkg.zhimg.com/hexo-butterfly-envelope/lib/line.png #信笺底部图片
         beforeimg: https://unpkg.zhimg.com/hexo-butterfly-envelope/lib/before.png # 信封前半部分
         afterimg: https://unpkg.zhimg.com/hexo-butterfly-envelope/lib/after.png # 信封后半部分
       message: #信笺正文,多行文本,写法如下
         - 有什么想问的?
         - 有什么想说的?
         - 有什么想吐槽的?
         - 哪怕是有什么想吃的,都可以告诉我哦~
       bottom: 自动书记人偶竭诚为您服务! #仅支持单行文本
       height: #1050px,信封划出的高度
       path: #【可选】comments 的路径名称。默认为 comments,生成的页面为 comments/index.html
       front_matter: #【可选】comments页面的 front_matter 配置
         title: 留言板
         comments: true
  3. 参数释义

    |参数|备选值/类型|释义| |:--|:--|:--| |enable|true/false|控制开关| |custom_pic.cover|URL|信笺头部图片链接| |custom_pic.line|URL|信笺底部图片链接| |custom_pic.beforeimg|URL|信封前半部分图片链接| |custom_pic.afterimg|URL|信封后半部分图片链接| |message|text|信笺正文,支持多行文本,写法见上文示例| |bottom|text|信笺底部信息,仅支持单行文本| |height|1050px|默认1050px,信封划出的高度| |path|comments|【可选】comments 的路径名称。默认为 comments,生成的页面为 comments/index.html| |front_matter|object|【可选】comments页面的 front_matter 配置,写法见上文示例|

    截图