Obsidian 插件:Badges
插件名片
概述
在笔记中添加内联徽章/标注。
原文出处
下面自述文件的来源于 Readme
Readme(翻译)
下面是 badges 插件的自述翻译
徽章
简介
这是一个轻量级的插件,用于在 Obsidian.md 中显示内联的“徽章”,类似于一个键值存储(数据库),可以通过默认搜索或 Dataview 插件进行查询。
用法
默认语法
`[!!KEY:VAL]`
语法 | 详情 |
---|---|
KEY | ICON 的类型和名称 |
VAL | 显示的值和文本 |
⚠️ 注意:
VAL
不能包含|
管道符号或:
冒号符号,因为它们被用作自定义语法的分隔符。
`[!!注意:note]`
`[!!信息:info]`
`[!!待办:todo]`
...
`[!!引用:cite]`
结果
`[!!紧急: 紧急]`
`[!!禁止: 禁止]`
`[!!停止: 停止]`
…
`[!!奖励: 奖励]`
`[!!保险库: 保险库]`
结果
Github
语法
`[!!|GHX>KEY:VAL]`
语法 | 详情 |
---|---|
| | 开始管道符号 |
GHX | Github 风格,可以选择 ghb 表示蓝色风格或 ghs 表示绿色成功风格 |
> | 大于符号(分隔符) |
KEY:VAL | KEY 是类型或标签,VAL 是显示的值文本。例如 release:1.0.0 |
⚠️ 注意:
VAL
不能包含|
管道符号或:
冒号符号,因为它们被用作自定义语法的分隔符。
`[!!|ghb>发布:1.2.1]`
`[!!|ghb>问题:2]`
`[!!|ghb>未解决问题:0]`
`[!!|ghb>已解决问题:2]`
`[!!|ghb>贡献者:3]`
`[!!|ghb>许可证:MIT]`
`[!!|ghs>检查:成功]`
`[!!|ghs>构建:成功]`
结果
纯文本
`[!!|KEY:VAL]`
语法 | 详情 |
---|---|
| | 开始管道符号 |
KEY:VAL | KEY 是类型,VAL 是值 |
`[!!|foo:bar]`
结果
自定义
`[!!|ICON|KEY:VAL|COLOR-RGB]`
语法 | 详细说明 |
---|---|
| | 开始管道符号 |
ICON | 图标的名称。例如:lucide-dice |
| | 管道符号 |
KEY:VAL | KEY 是类型或标签,VAL 是显示的值文本。例如:release:1.0.0 |
| | 管道符号 |
COLOR-RGB | 3 个(R.G.B.)数字(0-255)值,用逗号分隔。例如:144,144,144 或 CSS 变量例如:var(--color-red-rgb) |
⚠️ 注意:
VAL
不能包含|
管道符号或:
冒号符号,因为它们被用作自定义语法的分隔符。
`[!!|message-square|comment:edited by j.d.|var(--color-cyan-rgb)]`
`[!!|dice|roll:eleven|120,82,238]`
`[!!|gem|mineral:emerald|var(--my-custom-rgb)]`
`[!!|apple|fruit:snack|var(--color-red-rgb)]`
`[!!|brain|brain:pkm|var(--color-purple-rgb)]`
`[!!|sun|weather:sunny|var(--color-yellow-rgb)]`
`[!!|cloudy|weather:cloudy|var(--mono-rgb-100)]`
`[!!|sunset|weather:8.44pm|var(--color-orange-rgb)]`
`[!!|dumbbell|reps:3 sets of 50|var(--mono-rgb-00)]`
`[!!|gift|event:wedding|var(--color-blue-rgb)]`
`[!!|plus-square|credit:$100|var(--color-green-rgb)]`
`[!!|minus-square|debit:$10|var(--color-pink-rgb)]`
结果
安装
从 Obsidian 的设置或首选项中:
社区插件 > 浏览等待官方审核搜索“Badges”
或者:
- 下载最新的 发布存档
- 解压下载的存档
- 将
badges
文件夹移动到/path/to/vault/.obsidian/plugins/
目录下 - 设置 > 社区插件 > 重新加载已安装的插件
- 启用插件
或者:
- 下载
main.js
、manifest.json
和styles.css
- 创建一个新的文件夹
/path/to/vault/.obsidian/plugins/badges
- 将所有 3 个文件移动到
/path/to/vault/.obsidian/plugins/badges
目录下 - 设置 > 社区插件 > 重新加载已安装的插件
- 启用插件
CSS
可以通过 CSS 片段应用自定义的 CSS 样式。所有的颜色和样式都可以被覆盖。
请参阅 CSS片段 - Obsidian帮助。
变量
body {
/* 边框 */
--inline-badge-border-color: 透明;
--inline-badge-border-radius: var(--radius-s);
--inline-badge-border: 1像素实线 var(--inline-badge-border-color);
/* 示例自定义颜色 */
--my-custom-rgb: var(--color-green-rgb);
}
/* 示例CSS自定义 */
.inline-badge[data-inline-badge^="vault"] {
--badge-color: var(--color-green-rgb);
color: rgba(var(--badge-color), .88);
background-color: rgba(var(--badge-color),.22);
}
数据视图
查看并复制示例数据视图查询:badges-dataview
开发
克隆这个仓库
cd /path/to/vault/.obsidian/plugins
git clone https://github.com/gapmiss/badges.git
cd badges
安装包并运行
npm i
npm run dev
启用插件
- 打开
设置
→社区插件
- 启用
徽章
插件。
注意事项
Lucide 图标许可证:https://lucide.dev/license
反馈交流
其他渠道
版权声明
版权声明:所有 PKMer 文章如果需要转载,请附上原文出处链接。