From 53cf411c2f16c3f1af4c4987e98ca5c1d784971a Mon Sep 17 00:00:00 2001
From: Yan Lin <github@yanlincs.com>
Date: Tue, 3 Feb 2026 10:45:30 +0100
Subject: [PATCH] more flexible implementation of TOC

---
 content/dl4traj/end-to-end/index.md |  5 ++--
 templates/page.html                 | 44 ++++++++++++++++-------------
 templates/shortcodes/toc.html       |  1 +
 3 files changed, 27 insertions(+), 23 deletions(-)
 create mode 100644 templates/shortcodes/toc.html

diff --git a/content/dl4traj/end-to-end/index.md b/content/dl4traj/end-to-end/index.md
index 6e8c4c8..d04b1cc 100644
--- a/content/dl4traj/end-to-end/index.md
+++ b/content/dl4traj/end-to-end/index.md
@@ -2,9 +2,6 @@
 title = "End-to-end Learning of Spatiotemporal Trajectories"
 date = 2026-02-02
 description = ""
-
-[extra]
-toc = true
 +++
 
 End-to-end learning means training a model to perform a task from input to output, supervising only on how the output aligns with the task's ground truth.
@@ -21,6 +18,8 @@ For each category of tasks, we will give a general problem formulation and the g
 
 > Schema overview of the three categories of end-to-end trajectory learning tasks.
 
+{{ toc() }}
+
 ## Trajectory Prediction
 
 Recall in the [introduction post](@/dl4traj/introduction/index.md) that a complete trajectory usually records the movement of the target from the beginning to the end of the movement process.
diff --git a/templates/page.html b/templates/page.html
index 7dee6ca..a5999e5 100644
--- a/templates/page.html
+++ b/templates/page.html
@@ -12,27 +12,31 @@
         <time datetime="{{ page.date }}">{{ page.date | date(format="%B %d, %Y") }}</time>
         {% endif %}
     </header>
-    {% if page.extra.toc | default(value=false) %}
-    <nav class="toc">
-        <p class="toc-title">Table of Contents</p>
-        <ul>
-        {% for h2 in page.toc %}
-            <li>
-                <a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
-                {% if h2.children %}
-                <ul>
-                    {% for h3 in h2.children %}
-                    <li><a href="{{ h3.permalink | safe }}">{{ h3.title }}</a></li>
-                    {% endfor %}
-                </ul>
-                {% endif %}
-            </li>
-        {% endfor %}
-        </ul>
-    </nav>
-    {% endif %}
     <div class="content">
-        {{ page.content | safe }}
+        {% if page.content is containing("<!--TOC_PLACEHOLDER-->") %}
+            {% set parts = page.content | split(pat="<!--TOC_PLACEHOLDER-->") %}
+            {{ parts[0] | safe }}
+            <nav class="toc">
+                <p class="toc-title">Table of Contents</p>
+                <ul>
+                {% for h2 in page.toc %}
+                    <li>
+                        <a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
+                        {% if h2.children %}
+                        <ul>
+                            {% for h3 in h2.children %}
+                            <li><a href="{{ h3.permalink | safe }}">{{ h3.title }}</a></li>
+                            {% endfor %}
+                        </ul>
+                        {% endif %}
+                    </li>
+                {% endfor %}
+                </ul>
+            </nav>
+            {{ parts[1] | safe }}
+        {% else %}
+            {{ page.content | safe }}
+        {% endif %}
     </div>
 </article>
 {% endblock content %}
diff --git a/templates/shortcodes/toc.html b/templates/shortcodes/toc.html
new file mode 100644
index 0000000..d68c214
--- /dev/null
+++ b/templates/shortcodes/toc.html
@@ -0,0 +1 @@
+<!--TOC_PLACEHOLDER-->
\ No newline at end of file