Iterate over markdown headers to create navigation menu

github-pages, jekyll, liquid

Solution

I believe this can only be done with an extra plugin. Because you are running on GitHub pages, you can't use plugins.

This method is not automatic, but you achieve the same result.

_config.yml

nav:
- page: Header One
  permalink: #header-one

- page: Header Two
  permalink: #header-two

default.html

{% for n in site.nav %}
    <li><a href="{{ n.permalink }}">{{ n.page }}</a></li>
{% endfor %}

Problem

I would like to make a single-large-page with a menu on the side that links directly to sections inside this single page. Similar to the bootstrap manual pages. I would like to write the page content in markdown. How can I make jekyll automatically create the navigation menu from the headers in the markdown page? I.e. loop/iterate over the headers to insert menu items?

Original source