add read time and toc

i18n/en.yaml

@@ -18,11 +18,16 @@ search:
 panel:
   lastmod: "Recently Updated"
   trending_tags: "Trending Tags"
+  toc: "Contents"
 
 post:
   posted: "Posted"
   updated: "Updated"
   written_by: "By"
+  read_time:
+    prompt: "read"
+    unit: "min"
+    words: "words"
 
 copyright:
   brief: "All rights reserved"

i18n/zh.yaml

@@ -23,6 +23,11 @@ post:
   posted: "发布"
   updated: "更新"
   written_by: "由"
+  read_time:
+    prompt: "阅读"
+    unit: "分钟"
+    words: "字"
+
 copyright:
   brief: "版权所有"
   verbose: "版权所有"

layouts/_default/baseof.html

@@ -26,12 +26,14 @@
               {{ partialCached "update-list.html" . }}
               {{ partialCached "trending-tags.html" . }}
             </div>
+            {{ block "panel" . }}{{ end }}
           </aside>
         </div>
 
         <div class="row">
           <!-- tail -->
           <div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 px-md-4">
+            {{ block "tail" . }}{{ end }}
             {{ partialCached "footer.html" . }}
           </div>
         </div>

layouts/_default/single.html

@@ -82,6 +82,7 @@
             {{ end }}
 
             <!-- read time -->
+            {{ partial "read-time.html" (dict "content" .Content "prompt" true "lang" $lang) }}
 
           </div>
         </div>
@@ -154,4 +155,8 @@
       </div>
     </div>
   </article>
+{{ end }}
+
+{{ define "panel" }}
+  {{ partial "toc.html" . }}
 {{ end }}

layouts/partials/read-time.html

@@ -0,0 +1,35 @@
+<!-- Calculate the post's reading time, and display the word count in tooltip -->
+{{ $content := .content }}
+{{ $words := len (split $content " ") }}
+
+<!-- words per minute -->
+{{ $wpm := 180 }}
+{{ $min_time := 1 }}
+
+{{ $read_time := div $words $wpm }}
+
+{{ if lt $read_time 1 }}
+  {{ $read_time = $min_time }}
+{{ end }}
+
+{{ $lang := .lang | default site.Language.Lang }}
+{{ $read_prompt := i18n "post.read_time.prompt" (dict "Language" $lang) }}
+
+<!-- return element -->
+<span
+  class="readtime"
+  data-bs-toggle="tooltip"
+  data-bs-placement="bottom"
+  title="{{ $words }} {{ i18n "post.words" (dict "Language" $lang) }}"
+>
+  <em>
+    {{- $read_time -}}
+    {{ " " }}
+    {{- i18n "post.read_time.unit" (dict "Language" $lang) -}}
+  </em>
+  {{- if .prompt -}}
+    {{- $prompt_words := len (split $read_prompt " ") -}}
+    {{- if le $prompt_words 1 -}}{{ " " }}{{- end -}}
+    {{ $read_prompt }}
+  {{- end -}}
+</span>

layouts/partials/toc.html

@@ -0,0 +1,23 @@
+{{/* 
+  Table of Contents (TOC) partial
+  Checks if TOC should be enabled, then renders it if needed
+*/}}
+
+{{/* Determine if TOC should be enabled */}}
+{{ $enable_toc := false }}
+{{ $page_toc := default true .Params.toc }}  {{/* 如果 .Params.toc 不存在，默认 true */}}
+{{ if and site.Params.toc $page_toc }}
+  {{ if or (findRE "<h2" .Content) (findRE "<h3" .Content) }}
+    {{ $enable_toc = true }}
+  {{ end }}
+{{ end }}
+
+
+{{/* Render TOC if enabled */}}
+{{ if $enable_toc }}
+  <div class="toc-border-cover z-3"></div>
+  <section id="toc-wrapper" class="invisible position-sticky ps-0 pe-4 pb-4">
+    <h2 class="panel-heading ps-3 pb-2 mb-0">{{ i18n "panel.toc" }}</h2>
+    <nav id="toc"></nav>
+  </section>
+{{ end }}