Jekyll Kramdown TOC not building

Here is the final conclusion of what I would like to have:

<article itemscope itemtype="http://schema.org/BlogPosting"> <header> <h1>Jekyll Table of Contents with Kramdown </h1> </header> <nav aria-label="Table of Contents"> <ul> <li>Topic 1</li> <li>Topic 2</li> <li>Topic 3</li> </ul> <nav> <section itemprop="articleBody"> <p>the main body of the article</p> </section> </article> 

When installing Jekyll by default, Kramdown can create a TOC with

 * TOC {:toc} 

However, Markdown is not currently supported in HTML or layout files . I tried using [Capture and Markdownify} ( https://github.com/jekyll/jekyll/issues/6166#issuecomment-322771527 ) to add the above TOC call to the layout file without success

 // _layouts/post.html <article> <header> <h1>Jekyll Table of Contents with Kramdown </h1> </header> {% capture toc %}{% include toc.md %}{% endcapture %} {{ toc | markdownify }} <section itemprop="articleBody"> <p>the main body of the article</p> </section> </article> 

Adding a built-in markdown method works for a simple markdown, but not for calling TOC Kramdown.

 // this works {% capture md %} ## Heading 2 *Stuff added in my layout* {% endcapture %} {{ md | markdownify }} // This doesn't work {% capture md %} * TOC {:toc} {% endcapture %} {{ md | markdownify }} 

The only way I see around this is to include the layout part of the layout in the file after the mark.

 // _layouts/post.html <article> <header> <h1>Jekyll Table of Contents with Kramdown </h1> </header> {{ content }} </article> // _posts/post.md --- layout: post --- <nav aria-label="Table of Contents"> * TOC {:toc} </nav> <section itemprop="articleBody"> ## My Heading Standard markdown content here </section> 

The inverse conclusion here is that now I have a page layout in my post, which can be easily damaged and distracted by content editors.

Does anyone see a way around this?

+1
source share
1 answer

I found this superb Ruby Gem jekyll-toc - it generates a TOC that can be placed anywhere in your layout files.

Now I successfully use the following in _layouts/post.html :

 <nav aria-label="Table of Contents"> {{ content | toc_only }} </nav> <section itemprop="articleBody"> {{ content }} </section> 
+1
source

All Articles