登录 注册

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

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

✨ 功能

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

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

📝 使用介绍

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

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

  • 脚注存放位置：可以设置存放在当前文档或者指定文档，默认为 当前文档

  • 选中文本的样式：可以为选中文本添加加粗、高亮、斜体、下划线样式，默认：无样式

  • 插入脚注的顺序：顺序或者倒序，默认：顺序

  • 脚注标题：设置存放脚注的标题名，默认：脚注

  • 脚注块引锚文本：设置脚注引用的锚文本，默认：注

  • 脚注内容模板：设置脚注的模板，推荐使用引述块或超级块组合，保证脚注内容属于同一个块。 ${selection} 表示选中文本的内容，${content} 代表脚注内容占位

    • 嵌套引述块模板

      >> ${selection}
>> 
> 💡${content}

    • 竖向超级块组合模板

      {{{row
> ${selection}

${content}
}}}

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

🙏 致谢

❤️ 用爱发电

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

  • 思源笔记

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

    融合块、大纲和双向链接，重构你的思维。

    22378 引用 • 89573 回帖
2 操作
Achuan-2 在 2024-11-20 12:33:30 更新了该帖
Achuan-2 在 2024-11-19 12:49:35 更新了该帖
上海 位置
13 感谢
9 关注
8 收藏
1 赞同
2 操作
75 回帖
3
3
2
2
2
548 472 72 1 3

相关帖子

优质回帖
  • Achuan-2 • • 2 • 1 赞同
    订阅者 先知 作者

    @participants

    v1.0.6 / 2024.11.20

    • ✨ 脚注内容模板新增 ${refID}，代表选中文本所在的块 ID，现在可以通过模板插入选中文本所在的块链接了，方便在脚注内容里直接跳转到原来的块 
      {{{row
> ${selection} [[↩️]](siyuan://blocks/${refID})

${content}
}}}
{: style="border: 2px dashed var(--b3-border-color);"}

    思源笔记脚注插件支持直接跳转到原来的块.gif

  • Achuan-2 • • 1 • 1 赞同
    订阅者 先知 作者

    要用思源笔记 3.1.12dev 版本

    插件添加工具栏的 api 有变动，我用了最新的 api，不适配旧版本

  • Achuan-2 • • 1 • 1 赞同
    订阅者 先知 作者

    @participants

    插件更新 v1.0.5 / 2024.11.20

    • ✨ 支持设置脚注块引为块超链接
    • ✨ 支持设置脚注放在子文档

    PixPin20241120212520.png

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

欢迎来到这里！

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

注册 关于
请输入回帖内容 ...
  • Achuan-2 •
    订阅者 先知 作者

    感谢支持 ❤️

  • 其他回帖
  • Achuan-2 •
    订阅者 先知 作者

    另外学习了下给超级块加边框的操作，改下默认模板

    
{{{row

> ${selection}



${content}

}}}

{: style="border: 2px dashed var(--b3-theme-on-background);"}

    PixPin20241120122654.png

    1 回复
    1 操作
    Achuan-2 在 2024-11-20 12:26:59 更新了该回帖
  • Achuan-2 •
    订阅者 先知 作者

    把有脚注的文档导出为模板（即 kramdown 格式），写了个 js 可以把这个模板内容变为脚注数字编号，不过目前由于这个原因，/api/block/getBlockKramdown 支持导出 span 元素样式 · Issue #13183 · siyuan-note/siyuan 还得之后再集成到插件功能里去

    转化前

    PixPin20241118200658.png

    转化后

    PixPin20241118200646.png

    function processkramdown(kramdownText) {
    // 使用正则表达式匹配所有的脚注块引，不考虑data-subtype和span的文本内容
    const footnoteRegex = /<span data-type="block-ref sup"[^>]*data-id="([^"]+)"[^>]*>[^<]*<\/span>{: style="--memo: 1"}/g;
    let match;
    const ids = [];
  
    // 提取所有的data-id并记录第一次出现的顺序
    while ((match = footnoteRegex.exec(kramdownText)) !== null) {
        const id = match[1];
        if (!ids.includes(id)) {
            ids.push(id);
        }
    }

    // 更新脚注块引中的内容为对应的序号，并修改data-subtype为"d"
    let processedkramdown = kramdownText.replace(footnoteRegex, (match, id) => {
        const index = ids.indexOf(id) + 1; // 获取序号
        return `<span data-type="block-ref sup" data-subtype="d" data-id="${id}">${index}</span>{: style="--memo: 1"}`;
    });

    // 更新被引用的块的命名
    ids.forEach((id, index) => {
        const blockRegex = new RegExp(`({: id="${id}"[^}]*)}`, 'g');
        processedkramdown = processedkramdown.replace(blockRegex, `$1 name="${index + 1}"}`);
    });

    return processedkramdown;
}

// 导出为模板的内容
const kramdownText = `
...
`;

// 处理Markdown文本
const processedkramdown = processkramdown(kramdownText);
console.log(processedkramdown);
  • Achuan-2 •
    订阅者 先知 作者

    🔖v1.0.9 / 2024.11.23 @participants

    • ✨ 当前文档的脚注容器标题和指定文档的脚注容器标题可以用“#”设置标题级别，不输入“#”，默认为二级标题
    • ✨ 设置界面改善，由于不会做设置分栏，所以只是给设置添加了“脚注存放位置”、“脚注样式设置”两个 title，方便查看
    • ✨ 支持重置设置，重置后会恢复插件默认设置

    PixPin20241123190805.png

  • 查看全部回帖
Achuan-2
给时间以生命而不是给生命以时间，如果你喜欢我的分享，欢迎给我买杯咖啡 https://www.yuque.com/achuan-2 上海
回帖
831
 帖子
226
 积分
665