能否给标题 Headings 自动编号? (已解决)

本贴最后更新于 851 天前,其中的信息可能已经东海扬尘

我的会员推广码(vfW6RGB )


标题自动编序号对于非文科的文档来说太重要了,可是能够给 Markdown 标题自动编号的工具还真的不多。例如:

  • (Python) Jupyter Notebook,可以通过插件来实现;
  • Typora 也是可以通过插件 (可能是修改 css) 实现自动加编号。

思源能不能增加这个特色功能呢?在显示和导出时,给个自动标题编号?


更新:

按已采纳的方法搞定了,但请注意,在我解决这个问题的过程中,新的 css 并不能通过重启思源或者按 F5 来生效。只有从系统注销登陆后,再次登陆用户后再打开思源笔记,css 样式才最终生效。

该方法的另一个局限性是导出的 HTML 是没有标题编号的。

  • 思源笔记

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

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

    18802 引用 • 70339 回帖 • 1 关注
  • Q&A

    提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。

    6587 引用 • 29565 回帖 • 250 关注

相关帖子

被采纳的回答
    1. 复制一份 dalight,并改个名

    image.png

    1. 修改 conf 下的 conf.json, 添加 daylightPlus

    image.png

    1. 修改 daylightPlus 中的 theme.css
    
    :root{
    	/*其他乱七八糟代码*/
    
    	/*手动添加的部分*/
    	counter-reset:counter_h2;
    }
    
    /*全部粘贴到 :root 外面*/
    
    /*标题章节号. H2 和 H3 有序号*/
    [data-subtype=h2][data-node-id].h2{
    	counter-increment: counter_h2;
    	counter-reset: counter_h3;
    }
    [data-subtype=h2][data-node-id].h2 [contenteditable][spellcheck]::before{
    	content:  "第"counter(counter_h2)"章 ";
    }
    [data-subtype=h3][data-node-id].h3{
    	counter-increment: counter_h3
    }
    [data-subtype=h3][data-node-id].h3 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h2)"."counter(counter_h3)" ";
    }
    
    1. 在 siyuan 中 按 F5

欢迎来到这里!

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

注册 关于
请输入回帖内容 ...
  • 目前只能通过自定义 CSS 实现,导出的话还不行。

    请关注 Issue #522 · siyuan-note/siyuan 如果后面要做的话会重开,谢谢。

    1 回复
  • buzzingbee
    作者

    感谢关注,我从这个论坛没有搜索出来。希望早日有人提供相关插件或自定义方法,我自己是不会的。

  • :root{
    /*打开theme.css第一个就是这个 root*/
        counter-reset:counter_h1;
    }
    
    /****************************************自定义CSS****************************************/
    [data-subtype=h1][data-node-id].h1{
    	counter-increment: counter_h1;
    	counter-reset: counter_h2;
    }
    [data-subtype=h1][data-node-id].h1 [contenteditable][spellcheck]::before{
    	content:  "第"counter(counter_h1)"章 ";
    }
    [data-subtype=h2][data-node-id].h2{
    	counter-increment: counter_h2
    }
    [data-subtype=h2][data-node-id].h2 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h1)"."counter(counter_h2)" ";
    }
    
    

    image.png

    1 回复
  • buzzingbee
    作者

    非常感谢提供代码,但我居然看着你的答案没搞定。

    首先,我尝试修改工作空间的 theme.css, 不起作用,原因应该是每次启动时,该 theme.css 文件会被另一个原版的 theme.css 替代;

    然后,我修改安装目录中 theme.css,启动思源后,该文件的确被复制到了工作空间,但是仍然不起作用;

    所以我认为,应该是我修改 theme.css 的方法不正确。请问:

    1. 你给的所有代码是做为一个整体复制并粘贴到 theme.css 中的某一行中去吗?放在哪一行不容易出错?
    2. 看到你的代码的自定义部分是写在 :root{} 的定义之外的,是不是我要把这一部分放在 root{} 之外呢? 我试过了,也没起作用

    感谢!

    3 回复
    1. 复制一份 dalight,并改个名

    image.png

    1. 修改 conf 下的 conf.json, 添加 daylightPlus

    image.png

    1. 修改 daylightPlus 中的 theme.css
    
    :root{
    	/*其他乱七八糟代码*/
    
    	/*手动添加的部分*/
    	counter-reset:counter_h2;
    }
    
    /*全部粘贴到 :root 外面*/
    
    /*标题章节号. H2 和 H3 有序号*/
    [data-subtype=h2][data-node-id].h2{
    	counter-increment: counter_h2;
    	counter-reset: counter_h3;
    }
    [data-subtype=h2][data-node-id].h2 [contenteditable][spellcheck]::before{
    	content:  "第"counter(counter_h2)"章 ";
    }
    [data-subtype=h3][data-node-id].h3{
    	counter-increment: counter_h3
    }
    [data-subtype=h3][data-node-id].h3 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h2)"."counter(counter_h3)" ";
    }
    
    1. 在 siyuan 中 按 F5
    2 回复
    1. :root{ } 里面的代码,你放在 :root{ } 里面 第一行或者最后一行就好.
    2. 自定义的部分放在 :root 外面. 直接拉到 theme.css 文件底部然后复制进去
    3. daylight 是思源的默认主题,每次打开软件都会重置,不要再 daylight 上面修改. 具体方法参见上面的回复
  • 想要 h1 开始计数,就把 h2 全改成 h1

    想要 h4 也有次级标题,就把 h3 的复制一遍,并改成 h4. 同时自定义部分,第一个 h3 参考一下 h2 添加一下 counter-reset: counter_h3

    再往下同理.

  • buzzingbee
    作者

    非常详细,这次搞定了!谢谢!

  • tenstu

    层主你好,我按你的做法进行修改,对 HI 和 H2 标题都成功了,但是三级标题及以下都不能显示正常序号,能麻烦看一下吗?

    /****************************************自定义CSS****************************************/
    [data-subtype=h1][data-node-id].h1{
    	counter-increment: counter_h1;
    	counter-reset: counter_h2;
    }
    [data-subtype=h1][data-node-id].h1 [contenteditable][spellcheck]::before{
    	content:  "第"counter(counter_h1)"章 ";
    }
    [data-subtype=h2][data-node-id].h2{
    	counter-increment: counter_h2;
    	counter-reset: counter_h3;
    }
    [data-subtype=h2][data-node-id].h2 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h1)"."counter(counter_h2)" ";
    }
    [data-subtype=h3][data-node-id].h3{
    	counter-increment: counter_h3;
    	counter-reset: counter_h4;
    }
    [data-subtype=h3[data-node-id].h3 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h1)"."counter(counter_h2)"."counter(counter_h3)" ";
    }
    [data-subtype=h4][data-node-id].h4{
    	counter-increment: counter_h4;
    	counter-reset: counter_h5;
    }
    [data-subtype=h4][data-node-id].h4 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h1)"."counter(counter_h2)"."counter(counter_h3)"."counter(counter_h4)" ";
    }
    [data-subtype=h5][data-node-id].h5{
    	counter-increment: counter_h5
    }
    [data-subtype=h5][data-node-id].h5 [contenteditable][spellcheck]::before{
    	content:  counter(counter_h1)"."counter(counter_h2)"."counter(counter_h3)"."counter(counter_h4)"."counter(counter_h5)" ";
    }
    

    按 F5、重启思源,注销电脑账户都试过了,还是不能生效

    1 回复
  • tenstu

    楼主你好,你提到的注销生效是指电脑系统注销吗?还是思源账户退出登录,两者我都试了,还是不能生效,请问你是怎么生效的?

    1 回复
    1 操作
    tenstu 在 2021-09-30 16:13:42 更新了该回帖
  • buzzingbee
    作者

    注销系统

  • crowds21 1 评论

    image.png

    1 回复
    少了一个方括号
    crowds21
  • tenstu

    😭 可以了,谢谢大佬,居然是这个地方错了,因为先前设置两级的时候成功了,以为代码就不会出问题了,还是没检查到位啊

  • ttChen

    标题编号 - 动作信息 - Quicker (getquicker.net)

    解决了通过 CSS 编号导致后续笔记导出时出现编号消失的问题;

    解决了 H1 标题不存在时,出现标题 0.1、0.01 等错误编号问题

    1 回复
  • Nefelibata

    能否开发一个思源内部的挂件?实在不想因为一个功能再装一个软件,还要注册

请输入回帖内容 ...

推荐标签 标签

  • OpenResty

    OpenResty 是一个基于 NGINX 与 Lua 的高性能 Web 平台,其内部集成了大量精良的 Lua 库、第三方模块以及大多数的依赖项。用于方便地搭建能够处理超高并发、扩展性极高的动态 Web 应用、Web 服务和动态网关。

    17 引用 • 41 关注
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞 I/O 模型而得以轻量和高效。

    138 引用 • 268 回帖 • 192 关注
  • 尊园地产

    昆明尊园房地产经纪有限公司,即:Kunming Zunyuan Property Agency Company Limited(简称“尊园地产”)于 2007 年 6 月开始筹备,2007 年 8 月 18 日正式成立,注册资本 200 万元,公司性质为股份经纪有限公司,主营业务为:代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。

    1 引用 • 22 回帖 • 688 关注
  • RESTful

    一种软件架构设计风格而不是标准,提供了一组设计原则和约束条件,主要用于客户端和服务器交互类的软件。基于这个风格设计的软件可以更简洁,更有层次,更易于实现缓存等机制。

    30 引用 • 114 回帖
  • SVN

    SVN 是 Subversion 的简称,是一个开放源代码的版本控制系统,相较于 RCS、CVS,它采用了分支管理系统,它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 693 关注
  • H2

    H2 是一个开源的嵌入式数据库引擎,采用 Java 语言编写,不受平台的限制,同时 H2 提供了一个十分方便的 web 控制台用于操作和管理数据库内容。H2 还提供兼容模式,可以兼容一些主流的数据库,因此采用 H2 作为开发期的数据库非常方便。

    11 引用 • 54 回帖 • 640 关注
  • ngrok

    ngrok 是一个反向代理,通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

    7 引用 • 63 回帖 • 598 关注
  • 京东

    京东是中国最大的自营式电商企业,2015 年第一季度在中国自营式 B2C 电商市场的占有率为 56.3%。2014 年 5 月,京东在美国纳斯达克证券交易所正式挂牌上市(股票代码:JD),是中国第一个成功赴美上市的大型综合型电商平台,与腾讯、百度等中国互联网巨头共同跻身全球前十大互联网公司排行榜。

    14 引用 • 102 回帖 • 406 关注
  • Swift

    Swift 是苹果于 2014 年 WWDC(苹果开发者大会)发布的开发语言,可与 Objective-C 共同运行于 Mac OS 和 iOS 平台,用于搭建基于苹果平台的应用程序。

    34 引用 • 37 回帖 • 497 关注
  • 职场

    找到自己的位置,萌新烦恼少。

    126 引用 • 1699 回帖 • 2 关注
  • VirtualBox

    VirtualBox 是一款开源虚拟机软件,最早由德国 Innotek 公司开发,由 Sun Microsystems 公司出品的软件,使用 Qt 编写,在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。

    10 引用 • 2 回帖 • 7 关注
  • Latke

    Latke 是一款以 JSON 为主的 Java Web 框架。

    70 引用 • 532 回帖 • 713 关注
  • 阿里云

    阿里云是阿里巴巴集团旗下公司,是全球领先的云计算及人工智能科技公司。提供云服务器、云数据库、云安全等云计算服务,以及大数据、人工智能服务、精准定制基于场景的行业解决方案。

    89 引用 • 345 回帖
  • Sillot

    Sillot (汐洛)孵化自思源笔记,致力于服务智慧新彖乄,具有彖乄驱动、极致优雅、开发者友好的特点
    Github 地址:https://github.com/Hi-Windom/Sillot

    17 引用 • 6 回帖 • 27 关注
  • MySQL

    MySQL 是一个关系型数据库管理系统,由瑞典 MySQL AB 公司开发,目前属于 Oracle 公司。MySQL 是最流行的关系型数据库管理系统之一。

    675 引用 • 535 回帖
  • CSS

    CSS(Cascading Style Sheet)“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    180 引用 • 447 回帖
  • 服务器

    服务器,也称伺服器,是提供计算服务的设备。由于服务器需要响应服务请求,并进行处理,因此一般来说服务器应具备承担服务并且保障服务的能力。

    124 引用 • 580 回帖
  • JRebel

    JRebel 是一款 Java 虚拟机插件,它使得 Java 程序员能在不进行重部署的情况下,即时看到代码的改变对一个应用程序带来的影响。

    26 引用 • 78 回帖 • 623 关注
  • Openfire

    Openfire 是开源的、基于可拓展通讯和表示协议 (XMPP)、采用 Java 编程语言开发的实时协作服务器。Openfire 的效率很高,单台服务器可支持上万并发用户。

    6 引用 • 7 回帖 • 87 关注
  • WebComponents

    Web Components 是 W3C 定义的标准,它给了前端开发者扩展浏览器标签的能力,可以方便地定制可复用组件,更好的进行模块化开发,解放了前端开发者的生产力。

    1 引用 • 24 关注
  • Flutter

    Flutter 是谷歌的移动 UI 框架,可以快速在 iOS 和 Android 上构建高质量的原生用户界面。 Flutter 可以与现有的代码一起工作,它正在被越来越多的开发者和组织使用,并且 Flutter 是完全免费、开源的。

    39 引用 • 92 回帖 • 8 关注
  • WordPress

    WordPress 是一个使用 PHP 语言开发的博客平台,用户可以在支持 PHP 和 MySQL 数据库的服务器上架设自己的博客。也可以把 WordPress 当作一个内容管理系统(CMS)来使用。WordPress 是一个免费的开源项目,在 GNU 通用公共许可证(GPLv2)下授权发布。

    45 引用 • 113 回帖 • 310 关注
  • InfluxDB

    InfluxDB 是一个开源的没有外部依赖的时间序列数据库。适用于记录度量,事件及实时分析。

    2 引用 • 55 关注
  • 程序员

    程序员是从事程序开发、程序维护的专业人员。

    534 引用 • 3528 回帖
  • Maven

    Maven 是基于项目对象模型(POM)、通过一小段描述信息来管理项目的构建、报告和文档的软件项目管理工具。

    186 引用 • 318 回帖 • 342 关注
  • 机器学习

    机器学习(Machine Learning)是一门多领域交叉学科,涉及概率论、统计学、逼近论、凸分析、算法复杂度理论等多门学科。专门研究计算机怎样模拟或实现人类的学习行为,以获取新的知识或技能,重新组织已有的知识结构使之不断改善自身的性能。

    76 引用 • 37 回帖 • 1 关注
  • V2EX

    V2EX 是创意工作者们的社区。这里目前汇聚了超过 400,000 名主要来自互联网行业、游戏行业和媒体行业的创意工作者。V2EX 希望能够成为创意工作者们的生活和事业的一部分。

    17 引用 • 236 回帖 • 418 关注