ETOOBUSY 🚀 minimal blogging for the impatient
kramdown Table of Contents in pages
TL;DR
I hopefully restored the table of contents in wide-range pages.
In previous post GitHub Pages failed me I ranted a bit about lack of support for [jekyll-toc][] in GitHub Pages.
Anwyay, no fault on GitHub side: that’s what is written on the can and they stick to it. For security reasons, which is good.
Anyway, the table of content rendered like badly smelling stuff so I tried to look for alternatives. It turns out that kramdown already knows how to generate a table of contents, so it was a matter of using it.
With a twist, though: I wanted to preserve my hardly crafted side navigation bar, and it was not exactly straighforward.
To make a long story short, this is the page template:
---
layout: default
---
<article class="post">
<header class="post-header">
<h1 class="post-title">{{ page.title }}</h1>
</header>
<div class="page-container">
{{ content }}
</div>
{% include clipboard.html %}
</article>
I had to go back to a single {{ content }}
thingie,
which means moving the two-divs structure inside the page.
Each page must then have the following structure inside:
<div class="page-nav">
{:toc}
* this is the toc
</div>
<div class="post-content" id="content">
Yadda yadda yadda
</div>
The last bit is to tell the kramdown processor to indeed consider some HTML blocks for expansion:
markdown: kramdown
kramdown:
parse_block_html: true
And with this, I guess that’s all folks!