💄 Add list number before table of content and article's head outline.

assets/css/_common/components/post/index.scss

@@ -42,6 +42,32 @@
   }
 }
 
+.autonumber {
+  h2 {
+    counter-reset: h3;
+    &:before{
+      counter-increment: h2; 
+      content: counter(h2) ". ";
+    }
+  }
+
+  h3 {
+    counter-reset: h4;
+    &:before{
+      counter-increment: h3; 
+      content: counter(h2) ". " counter(h3) ". ";
+    }
+  }
+
+  h4 {
+    counter-reset: h5;
+    &:before{
+      counter-increment: h4; 
+      content: counter(h2) "." counter(h3) "." counter(h4) ". ";
+    }
+  }
+} 
+
 @import 'post-collapse';
 @import 'post-body';
 @import 'post-gallery';

assets/css/_common/outline/sidebar/sidebar-toc.scss

@@ -1,62 +1,67 @@
-@if $toc_enable {
-  .post-toc {
-    font-size: $font-size-small;
-    padding: 0 8px;
 
-    ul {
+.post-toc {
-      list-style: none;
+  font-size: $font-size-small;
-      margin: 0;
+  padding: 0 8px;
-      padding: 0 2px 5px 10px;
+  
-      text-align: left;
+  ul {
+    list-style: none;
+    margin: 0;
+    padding: 0 2px 5px 10px;
+    text-align: left;
+    counter-reset: item;
 
-      > li {
+    > li {
-        padding-left: 0;
+      padding-left: 0;
+    }
+
+    a {
+      transition: all $transition-ease;
+
+      &:before {
+        content: counters(item, ".") ". "; 
+        counter-increment: item;
       }
+    }
+  }
 
-      a {
+  .nav-item {
-        transition: all $transition-ease;
+    line-height: 1.8;
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    @if not $toc_wrap {
+      white-space: nowrap;
+    }
+  }
+
+  .nav {
+    .nav-child {
+      display: if($toc_expand_all, block, none);
+    }
+
+    .active > .nav-child {
+      display: block;
+    }
+
+    .active-current > .nav-child {
+      display: block;
+
+      > .nav-item {
+        display: block;
       }
     }
 
-    .nav-item {
+    .active > a {
-      line-height: 1.8;
+      border-bottom-color: $sidebar-highlight;
-      overflow: hidden;
+      color: $sidebar-highlight;
-      text-overflow: ellipsis;
-
-      @if not $toc_wrap {
-        white-space: nowrap;
-      }
     }
 
-    .nav {
+    .active-current > a {
-      .nav-child {
+      color: $sidebar-highlight;
-        display: if($toc_expand_all, block, none);
-      }
 
-      .active > .nav-child {
+      &:hover {
-        display: block;
-      }
-
-      .active-current > .nav-child {
-        display: block;
-
-        > .nav-item {
-          display: block;
-        }
-      }
-
-      .active > a {
-        border-bottom-color: $sidebar-highlight;
         color: $sidebar-highlight;
       }
-
-      .active-current > a {
-        color: $sidebar-highlight;
-
-        &:hover {
-          color: $sidebar-highlight;
-        }
-      }
     }
   }
 }

assets/css/_common/scaffolding/normalize.scss

@@ -17,6 +17,7 @@ html {
  */
 body {
   margin: 0;
+  counter-reset: h2;
 }
 
 /**

exampleSite/config.yaml

@@ -61,12 +61,6 @@ markup:
     noHl: false
     style: monokai
     tabWidth: 2
-  tableOfContents:
-    # 开始/结束标题级别：1-6
-    # Heading title level of start or end: 1-6
-    startLevel: 1
-    endLevel: 3
-    ordered: false
 
 # 站点文章导航文件
 # Site map of all articles

exampleSite/content/flinks.md

@@ -4,13 +4,11 @@ type: flinks
 url: flinks.html
 ---
 
-如想要交换友情链接，请在评论区留下你的站点信息，格式参考如下：
+如想交换本站友情链接，请在评论区留下你的站点信息，格式参考如下：
 
-{{< note success no-icon >}}
+```yaml
-
+- name: Hugo-NexT
- **名称：** NexT 主题 <br/>
+  desc: Hugo NexT 官方预览网站。
- **说明：** 保持简单的易用性和强大的功能。 <br/>
+  avatar: https://hugo-next.eu.org/imgs/hugo_next_avatar.png
- **站标：** https://hugo-next.eu.org/imgs/hugo_next_avatar.png <br/>
+  link: https://hugo-next.eu.org
- **网址：** https://hugo-next.eu.org <br/>
+```
-
-{{< /note >}}

exampleSite/content/post/custom-files.md

@@ -21,7 +21,7 @@ toc: true
 
 <!--more-->
 
-# 打开配置参数
+## 打开配置参数
 
 首先要明确在配置文件的 `params` 区域中有配置如下参数：
 
@@ -40,7 +40,7 @@ customFilePath:
 
 然后在站点的根目录下创建 `layouts/partials` 2个目录，用于存放自定布局设计文件，另外在站点根目录下创建 `statics/css` 2个目录，用于存放自定义 CSS 样式文件。一切就绪后，就可以参考如下的步骤，完成自己的设计想法。
 
-# 侧边栏设计
+## 侧边栏设计
 
 在前面创建 `partials` 目录中新一个后缀名为 `html` 的文件，可以在里面书写你所想表达的设计或内容，比如引入一些第三方组件内容。示例如下：
 
@@ -52,7 +52,7 @@ customFilePath:
 
 再把该文件的路径配置到相应的参数中，效果请查看左侧边栏底部的效果。
 
-# 底部设计
+## 底部设计
 
 在前面创建 `partials` 目录中新一个后缀名为 `html` 的文件，可以在里面书写你所想表达的设计或内容，比如引入一些第三方组件内容。示例如下：
 
@@ -65,7 +65,7 @@ Website source code <a href="https://github.com/hugo-next/hugo-theme-next/tree/d
 再把该文件的路径配置到相应的参数中，效果请查看站点底部的效果。
 
 
-# 自定义样式
+## 自定义样式
 
 在前面创建 `css` 目录中新一个后缀名为 `css` 的文件，然后可以在里面把站点的样式进行重定义，或是增加一些自己定义的样式设计，在写文章时进行引用，示例如下：
 

exampleSite/content/post/emoji-support.md

@@ -12,7 +12,6 @@ tags:
  - 表情
  - emoji
 
-toc: false
 url: "post/emoji-support.html"
 ---
 

exampleSite/content/post/external-link.md

@@ -25,11 +25,11 @@ weight: 1
 
 
 
-# 用户指南
+## 用户指南
 
 设置 NexT 主题很容易。只需遵循文档，就可快速创建您的个人网站！
 
-# 反馈
+## 反馈
 
 - 访问 Awesome NexT 列表，与其他用户分享插件和教程。
 - 加入我们的 Gitter 聊天。

exampleSite/content/post/hello-world.md

@@ -12,6 +12,7 @@ tags:
  - 开始
 
 url: post/hello-world.html
+toc: true
 weight: 2
 ---
 

exampleSite/content/post/mermaid-charts.md

@@ -22,7 +22,7 @@ toc: true
 
 <!--more-->
 
-# 使用说明
+## 使用说明
 
 {{< note info >}}
 
@@ -32,7 +32,7 @@ toc: true
 
 {{< /note >}}
 
-# 流程图
+## 流程图
 
 ```shell
 {{</* mermaid align="left" */>}}
@@ -52,7 +52,7 @@ graph TD;
     C-->D;
 {{< /mermaid >}}
 
-# 时序图
+## 时序图
 
 ```shell
 {{</* mermaid bc="#eee"  */>}}
@@ -84,7 +84,7 @@ sequenceDiagram
     Bob-->>John: Jolly good!
 {{< /mermaid >}}
 
-# 类图
+## 类图
 
 ```shell
 {{</* mermaid */>}}
@@ -121,7 +121,7 @@ Class01 : int gorilla
 Class08 <--> C2: Cool label
 {{< /mermaid >}}
 
-# 甘特图
+## 甘特图
 
 ```shell
 {{</* mermaid */>}}
@@ -150,7 +150,7 @@ Future task               :         des3, after des2, 5d
 Future task2               :         des4, after des3, 5d
 {{< /mermaid >}}
 
-# 实体关系图
+## 实体关系图
 
 ```shell
 {{</* mermaid */>}}
@@ -167,7 +167,7 @@ erDiagram
     CUSTOMER }|..|{ DELIVERY-ADDRESS : uses
 {{< /mermaid >}}
 
-# 用户旅程
+## 用户旅程
 
 ```shell
 {{</* mermaid */>}}

exampleSite/content/post/shortcodes.md

@@ -18,7 +18,7 @@ url: "post/shortcodes.html"
 
 <!--more-->
 
-# 块引用
+## 块引用
 
 在引用一些经典名言名句时，可以采用此短语，语法参考如下：
 
@@ -42,7 +42,7 @@ url: "post/shortcodes.html"
 
 {{< /quote >}}
 
-# 信息块
+## 信息块
 
 支持 `default`，`info`，`success`，`warning`，`danger` 等五种不同效果的展示，语法参考如下：
 

exampleSite/content/post/syntax-highlighting.md

@@ -22,9 +22,9 @@ Hugo 通过 Chroma 提供非常快速的语法高亮显示，现 Hugo 中使用
 
 <!--more-->
 
-# 编程语言
+## 编程语言
 
-## GO
+### GO
 
 {{< highlight go "linenos=table,hl_lines=8 15-17,linenostart=199" >}}
 
@@ -41,7 +41,7 @@ func GetTitleFunc(style string) func(s string) string {
 
 {{< / highlight >}}
 
-## Java
+### Java
 
 ```java
 import javax.swing.JFrame;  //Importing class JFrame
@@ -58,13 +58,13 @@ public class HelloWorld {
 }
 ```
 
-## Python
+### Python
 
 ``` python
 print "Hello, world!"
 ```
 
-## Git 对比
+### Git 对比
 
 ``` diff {hl_lines=[4,"6-7"]， linenos=true}
 *** /path/to/original ''timestamp''
@@ -92,9 +92,9 @@ It is important to spell
 +new line
 ```
 
-# 文件
+## 文件
 
-## Make 文件
+### Make 文件
 
 ``` makefile {linenos=false}
 CC=gcc
@@ -104,7 +104,7 @@ hellomake: hellomake.o hellofunc.o
      $(CC) -o hellomake hellomake.o hellofunc.o -I.
 ```
 
-## Markdown 文档
+### Markdown 文档
 
 ``` markdown
 **bold**
@@ -112,9 +112,9 @@ hellomake: hellomake.o hellofunc.o
 [link](www.example.com)
 ```
 
-# 数据内容
+## 数据内容
 
-## JSON 数据
+### JSON 数据
 
 ``` json
 {"employees":[
@@ -122,7 +122,7 @@ hellomake: hellomake.o hellofunc.o
 ]}
 ```
 
-## XML 内容
+### XML 内容
 
 ``` xml
 <employees>
@@ -132,7 +132,7 @@ hellomake: hellomake.o hellofunc.o
 </employees>
 ```
 
-## SQL 查询
+### SQL 查询
 
 {{< highlight sql >}}
 

exampleSite/content/post/table-of-content.md

@@ -23,38 +23,38 @@ url: post/table-of-content.html
 
 ![禇老](https://wfqqreader-1252317822.image.myqcloud.com/cover/568/814568/t6_814568.jpg)
 
-# 早年的故事
+## 早年的故事
 
-## 起始
+### 起始
 
 2014年的春天，在云南省华宁县和宜良县的交界处，一座名叫矣则的小山村里，一处已经有上百年历史的古旧四合院宅子被拆掉。村委会正带领村民们进行“美丽乡村”的建设，一年以后，旧有村居将再也看不到，代之而起的是钢筋混凝土的新式民居。就像10年、20年前中国大小城市的改造一样，这个群山围绕的小村子也开始陷入“工地模式”。
 
-### 童年浪花
+#### 童年浪花
 
 在江河边长大的孩子几乎都有一个当仁不让的特长：善水。褚时健也不例外，他不仅从小就在南盘江和花鱼塘里扑腾出了上佳的游泳技术，五六岁已经可以一个猛子扎出老远，而且从七八岁就可以在南盘江和河滩上的鱼塘里捉鱼了。
 
-## 少年故事
+### 少年故事
 
 褚时健在乡村自由自在生活的十多年，其实正是中国社会风雨飘摇的十多年。特别是1937年卢沟桥事变后，日本人发动全面侵华战争，短短两三年间，中国的大部分国土相继沦陷
 
-# 激情的青春十年
+## 激情的青春十年
 
-## 当上了游击队员
+### 当上了游击队员
 
 1948年夏天，褚时健回乡，在禄丰车站小学做了一名老师，同时也和褚时仁、褚时杰一起继续保持与共产党组织的联系，做一些传递情报的工作
 
-### 战火纷飞
+#### 战火纷飞
 
 因为战斗力相较悬殊，所以游击队只能是靠打一枪换一个地方的办法，专找敌人薄弱的地方攻击，但更多时候，都是在防御和转移阵地。
 
-# 生活的断层
+## 生活的断层
 
-## 跌入生活底层
+### 跌入生活底层
 
 “反右”运动中被打倒的人在“右派”身份确定后，只有一条路可走：下放到农场。农场名副其实，就是干农活儿的地方，必须过和农民一样的生活。
 
-# 尾声
+## 尾声
 
-## 岁月像一条河
+### 岁月像一条河
 
 2015年，是褚时健和马静芬结婚60周年，被称为“钻石婚”的纪念年份。这简直是一份人生的奖赏,在中国离婚率愈益升高的当下，60年的婚姻，几乎就像一个前世之梦。一个甲子的相伴相随，褚时健和马静芬共同经历了国家和个人的各种风浪，共同面对过生死。他们两人已经不仅是夫妻，更是一对战友。尽管马静芬偶尔会对褚时健年轻时候的粗心抱怨上两句，但说到最后，她会说一句：“没有我就没有他，没有他也就没有我。”

exampleSite/data/flinks.yaml

@@ -16,7 +16,7 @@
 
     - name: 凡梦星尘空间站
       desc: 再平凡的人也有属于他的梦想！
-      avatar: https://lisenhui.cn/img/avatar.png
+      avatar: https://lisenhui.cn/imgs/avatar.png
       link: https://lisenhui.cn
 
     

layouts/partials/post.html

@@ -18,7 +18,8 @@
     <header class="post-header">
       {{ partial "post/header.html" (dict "ctx" .ctx "IsHome" .IsHome) }}
     </header>
-    <div class="post-body" itemprop="articleBody">
+    {{ $tocEnable := .ctx.Params.toc | default .ctx.Site.Params.toc.enable }}
+    <div class="post-body {{ if and $tocEnable .ctx.Site.Params.toc.number }} autonumber {{ end }}" itemprop="articleBody">
       {{ partial "post/body.html" (dict "ctx" .ctx "IsHome" .IsHome) }}
     </div>
     <footer class="post-footer">

layouts/partials/sidebar.html

@@ -4,8 +4,8 @@
   <span class="toggle-line"></span>
 </div>
 <aside class="sidebar">
-  {{- $toc := and (isset .Params "toc") .Params.toc }}
+  {{ $tocEnable := .Params.toc | default .Site.Params.toc.enable }}
-  <div class="sidebar-inner {{ if $toc }}sidebar-nav-active sidebar-toc-active{{ else }}sidebar-overview-active{{ end }}">
+  <div class="sidebar-inner {{ if $tocEnable }}sidebar-nav-active sidebar-toc-active{{ else }}sidebar-overview-active{{ end }}">
     <ul class="sidebar-nav">
       <li class="sidebar-nav-toc">
         {{ T "TableOfContents" }}
@@ -17,7 +17,7 @@
     <div class="sidebar-panel-container">
       <!--noindex-->
       <div class="post-toc-wrap sidebar-panel">
-        {{- if $toc }}
+        {{- if $tocEnable }}
         <div class="post-toc animated">{{ .TableOfContents }}</div>
         {{- end }}
       </div>

layouts/partials/sidebar/navtoc.html

@@ -1 +0,0 @@
-{{ .TableOfContents }}