登录注册

思源笔记丨写了一个插件，用块引实现脚注和备注

Github：Achuan-2/siyuan-plugin-blockref-footnote: 用块引实现脚注备注

✨ 功能

使用思源的块引实现脚注和备注功能

使用 Tsundoku 主题演示，对嵌套引述块样式进行了优化

📝 使用介绍

插件需要思源笔记版本 >3.1.12

本插件支持高度自定义化，支持的设置如下：

脚注存放位置：可以设置存放在当前文档或者指定文档，默认为 当前文档
选中文本的样式：可以为选中文本添加加粗、高亮、斜体、下划线样式，默认：无样式
插入脚注的顺序：顺序或者倒序，默认：顺序
脚注标题：设置存放脚注的标题名，默认：脚注
脚注块引锚文本：设置脚注引用的锚文本，默认：注
脚注内容模板：设置脚注的模板，推荐使用引述块或超级块组合，保证脚注内容属于同一个块。 ${selection} 表示选中文本的内容，${content} 代表脚注内容占位
- 嵌套引述块模板
```
>> ${selection}
>> 
> 💡${content}
```
- 竖向超级块组合模板
```
{{{row
> ${selection}

${content}
}}}
```

支持同时删除脚注引用和脚注内容，可以在脚注引用右键菜单，点击【插件-删除脚注】

🙏 致谢

https://github.com/zxhd863943427/siyuan-plugin-memo：基于该插件进行改进，添加了更多功能和配置项
https://github.com/siyuan-note/plugin-sample-vite-svelte：使用的插件模板，大幅提高开发效率

❤️ 用爱发电

穷苦研究生在读ing，如果喜欢我的插件，欢迎给 GitHub 仓库点 star 和捐赠，这会激励我继续完善此插件和开发新插件。

思源笔记

思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

融合块、大纲和双向链接，重构你的思维。
23014 引用 • 92566 回帖

2 操作

Achuan-2 在 2024-11-20 12:33:30 更新了该帖

Achuan-2 在 2024-11-19 12:49:35 更新了该帖

Achuan-2 1 个月前上海位置

14 感谢

10 关注

10 收藏

1 赞同

2 操作

95 回帖

987 686 1 254 2 1 43

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册关于

请输入回帖内容 ...

syuer9528 • 1 个月前
付费者

说话的工夫又更新了！！！！

大佬！！！！
Afterglow • 4 周前
订阅者恶龙

可以考虑一下适配移动端吗？有时回顾的时候，想写评论 😋

1 回复
Achuan-2 • 4 周前
订阅者先知作者

手机端没有工具栏吗，我手机空间不够，没有用手机端的思源

1 回复
xnyshu • 4 周前
支持者捐赠者

脚注标题为什么是二级？能不能改成自动一级标题？

1 回复
xnyshu • 4 周前
支持者捐赠者

删除脚注功能不合理。一般删除脚注标签 [注]都需要同时删除脚注内容以及脚注标题（在同一文档只剩一条脚注时）。能不能提供这种删除？

同一文档的脚注应该共用一个脚注标题。
Afterglow • 4 周前
订阅者恶龙

手机端选中文字，最下面的工具栏没有这个插件的评论功能。😂
Achuan-2 • 4 周前
订阅者先知作者

因为我自己最高只用 h2 标题，Markdown 里一般 h1 是当做文档名的

1 回复
xnyshu • 4 周前
支持者捐赠者

能不能设计成标题层级可选 H1？

另外，脚注位置能否增加一个放在源块之下。

1 回复
Achuan-2 • 4 周前
订阅者先知作者

给我的插件点 star，我就做

1 回复
xnyshu • 4 周前
支持者捐赠者

早就点 star 啊，大佬，谢谢了，麻烦添上这个功能。
xnyshu • 4 周前 • 1 赞同
支持者捐赠者

123 个下载，才 5 个点 star，各位，提醒一下链接在帖子第一行！
xnyshu • 4 周前
支持者捐赠者

另外，同一文档的脚注能不能像 word 一样用序号，排版效果用类似那种？

1 回复
Achuan-2 • 4 周前
订阅者先知作者

好的谢谢，数字编号之后会做，已经想好方案了
sweesalt • 4 周前
订阅者

想点 star，可这两天 github 一直无法访问
Achuan-2 • 4 周前
订阅者先知作者
🔖v1.0.9 / 2024.11.23 @participants
- ✨ 当前文档的脚注容器标题和指定文档的脚注容器标题可以用“#”设置标题级别，不输入“#”，默认为二级标题
- ✨ 设置界面改善，由于不会做设置分栏，所以只是给设置添加了“脚注存放位置”、“脚注样式设置”两个 title，方便查看
- ✨ 支持重置设置，重置后会恢复插件默认设置
CongSec • 4 周前
付费者捐赠者

一直想下载，但是找不到，最近更新思源才发现他出来了，原来和思源版本相关的，插件挺不错的 👍

1 回复
Achuan-2 • 4 周前
订阅者先知作者
v1.1.0 / 2024.11.23 @participants
- ✨ 支持设置脚注内容放到当前块后
xnyshu • 4 周前
支持者捐赠者

脚注内容最好不用超级块，直接用一个块： [01] 脚注内容。

1 回复
Achuan-2 • 4 周前
订阅者先知作者

脚注内容模板自己改为普通块格式即可，去除 selection 变量

1 操作
Achuan-2 在 2024-11-23 21:12:54 更新了该回帖
CongSec • 4 周前
付费者捐赠者

我想问下，全部脚注放在一个文档，随着时间的增加，性能方面有影响吗？我不打开他，只用到悬浮显示对应块即可

还有一个问题就是，删除脚注，但是脚注对应的下划线/高亮等等因该也要对应删除吧

2 回复
Achuan-2 • 4 周前 • 1
订阅者先知作者
1. 应该没有影响
2. 插件是脚注插件，不是划词评论插件，不认为选中文本添加的样式是脚注自带的，也不建议给选中文本添加样式。后面等如果插件能做到有专门的选中文本自定义样式，不依赖思源的自带样式，才能在删除的时候同时删除，否则无法判断前面的内容是不是本身就有的，而不是因为脚注才添加的
coco2 • 4 周前
付费者

怎么下载呀？要电脑版去集市安装吗

1 回复
syuer9528 • 4 周前
付费者

这才多大点儿内容！

我刚构建了一个 700 多个 H1 和 700 多张图的，毫无压力。

思源的加载是类似懒加载的路线，毫无压力。
CongSec • 4 周前
付费者捐赠者

是的，要将思源更新到最新版再从集市中寻找即可
Achuan-2 • 4 周前 • 1
订阅者先知作者
v1.1.1 / 2024.11.24 @@participants
- ✨ 添加脚注引用的 css 样式
- ✨ 脚注块引的自定义属性值改为脚注内容块 id custom-footnote="20241124013624-9oq7jfl"，方便删除脚注内容块和为后面的脚注数字编号功能做准备
- ✨ 选中文本的样式设置，取消加粗、高亮等原生样式，改用自定义样式。注意：如果有对重叠文字重复添加脚注的需求，请不要开启自定义样式，会有样式冲突问题。
1 操作
Achuan-2 在 2024-11-24 09:44:03 更新了该回帖
Adaxi • 4 周前

很有帮助，谢谢你的无私奉献
Achuan-2 • 4 周前 • 1
订阅者先知作者
v1.1.2 /2024.11.24 @participants
- 🐛 过滤掉脚注文本的正则表达式优化
- ✨ 选中文本添加自定义样式，现在支持对重叠文字添加不同脚注时，能保留不同脚注的选中文字样式，删除脚注时，只删除当前脚注选中的文本，不影响其他脚注选中文字的样式
- ✨ 支持添加快捷键，默认快捷键 ctrl+shift+F，可在设置自行修改
Achuan-2 • 4 周前
订阅者先知作者
v1.1.3 / 2024.11.24 @participants

✨ 脚注内容模板支持渲染 sprig 语法，现在可以在脚注内容中插入当前时间了
```
>> ${{now | date "20060102 15:04:05"}} 摘抄
>> ${selection} [[↩️]](siyuan://blocks/${refID})  
>>   
> 💡${content}
```
1 操作
Achuan-2 在 2024-11-24 15:05:14 更新了该回帖
Adaxi • 4 周前

不知能否实现删除“注”或其对应的脚注内容时，自动删除另一部分呢？

1 回复
Achuan-2 • 4 周前
订阅者先知作者

我暂时做不到自动删除，没有方案，本身也是 js 小白，对 js 不熟悉，全靠 ai 给我写插件

现在只能用右键菜单同时删除脚注引用和脚注内容

1 回复
Adaxi • 4 周前

感谢付出，很有用的插件，自动删除也不是刚需，一般注释的内容都是比较重要的，基本不会删除

1 回复
Achuan-2 • 4 周前
订阅者先知作者

也谢谢你的喜欢 ❤️
xnyshu • 3 周前
支持者捐赠者

怎样让两个[注]的样式一样都是蓝色链接文本？（现在的灰底样式感觉不好）另外，能不能在设置中提供设置脚注内容按 em 百分比设置文字大小？以及其他简单常用的外观设置：

2 回复
Achuan-2 • 3 周前
订阅者先知作者

自己写 css 放到代码片段改外观

两个需求都可以实现

脚注引用和脚注内容块我都加了特定属性，css 能直接找到这些元素修改样式

Achuan-2 • 3 周前 • 1

订阅者先知作者

自定义脚注引用的 css

/* 自定义脚注引用样式 */
.protyle-wysiwyg [data-node-id] span[custom-footnote] {
    /* 设置背景色 */
    background-color: var(--b3-font-background3);
  
    /* 设置文字颜色 */
    color: var(--b3-theme-on-background) !important;
  
    /* 移除边框 */
    border: none!important;
  
    /* 设置左右外边距 */
    margin: 0 1px;
  
    /* 设置圆角 */
    border-radius: 3px;
}

自定义脚注内容块的 css

/* 自定义脚注内容块样式 */
.protyle-wysiwyg [data-node-id][custom-plugin-footnote-content="true"] {
    /* 设置字体大小 */
    font-size: 0.8em;
  
    /* 设置文字颜色 */
    color: var(--b3-font-color5);
}

xnyshu • 3 周前
支持者捐赠者

脚注存放位置的选择，应该放在弹出的脚注内容编辑窗口里，因为有时候会需要改位置，不能事先都统一到同一个位置。

1 回复
xnyshu • 3 周前
支持者捐赠者

能不能把所有的脚注可修改 css 项做一个模版？

1 回复
Achuan-2 • 3 周前
订阅者先知作者

脚注内容没必要纠结存放位置，我建议不同文档脚注全放在一个文档里，专门存放脚注，有需要输出，自己再手动移动脚注内容块到当前文档或者其他地方

1 回复
Achuan-2 • 3 周前
订阅者先知作者

看不懂，插件添加的元素都加了自定义属性了，有需要可以用开发者工具查看属性，然后用自定义 css 片段修改
Achuan-2 • 3 周前 • 1
订阅者先知作者
v1.1.6 / 2024.11.30 脚注支持有序编号！ @participants
- 💄 在插件设置里添加自定义 css 设置
- ✨ 添加脚注弹出插件自定义的弹窗，进行输入脚注内容，可以避免使用块引浮窗不方便定位插件创建的单个块的问题，也能减少块引浮窗显示的延迟感
- ✨ 脚注支持有序编号
  
  支持排序脚注编号
  
  支持排序脚注内容块
  
  支持删除后进行编号
  
  添加自动排序设置
  
  命令面板添加重新排序命令
syuer9528 • 3 周前
付费者

呃移动脚注内容后，链接失效了。。因为 ID 变化了好像是。。。。。

1 回复
Achuan-2 • 3 周前
订阅者先知作者

移动不会变，剪切会变

1 回复
syuer9528 • 3 周前
付费者

原来如此！谢谢提点！
xnyshu • 3 周前
支持者捐赠者

升级后多出来一个窗口：
xnyshu • 3 周前
支持者捐赠者

脚注内容能不能也改成相应序号？