hexo的butterfly主题中写作的一些技巧(持续更新中)
带颜色的提示
普通引用
一般我们可以使用普通的引用来作为提示使用,例如:
1 | > 这是一条普通的引用。 |
渲染结果
这是一条普通的引用。
但是只有这种单一的引用,看着很不舒服,于是我去搜了一下,发现还有一些,接下来就介绍一下:
Notice(普通通知)
1 | {% note notice %} |
渲染结果
这是普通通知提示框(notice),适用于常规说明。
支持Markdown加粗、链接等语法。
Warning(警告提示)
1 | {% note warning %} |
渲染结果
这是警告提示框(warning),适用于需要注意的事项:
- 不要直接修改主题核心文件
- 备份_config.yml后再调整配置
Danger(危险提示)
1 | {% note danger %} |
渲染结果
这是危险提示框(danger),适用于错误/风险提醒:
删除Hexo的public目录前,请确认已备份静态文件!
Success(成功提示)
1 | {% note success %} |
渲染结果
这是成功提示框(success),适用于完成/确认提醒:
文章发布成功!已自动生成静态文件并部署到服务器。
提示的总结
核心前提
确保你的Butterfly主题版本≥3.0(旧版本也支持基础提示框,但样式参数更少),无需额外配置,直接在文章的Markdown内容中使用即可。
基础用法(直接用)
Butterfly的提示框核心语法:
1 | {% note 提示类型 可选参数 %} |
支持的提示类型(核心)
| 类型 | 对应样式 | 适用场景 |
|---|---|---|
notice/default |
蓝色(默认) | 普通通知、说明 |
warning |
黄色/橙色 | 警告、注意事项 |
danger |
红色 | 错误、危险提示 |
success |
绿色 | 成功、完成提示 |
info |
浅蓝/青色 | 补充信息、小贴士 |
primary |
深紫/深蓝 | 重点强调 |
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 lovone的技术折腾记录!






