Hi Jekyll builders. I want to share a solution around menus and hope that others can learn or use this approach.
My problem was how to add a page to a nested folder structure and have it automatically added to a navigation menu.
And to only show files and folders at the current level - without having to have a huge sidebar or navbar that covers the whole site.
Nested Jekyll Menus
I solved this with a proof of concept repo - it has a demo site on GH Pages (jekyll 3 and no extra plugins) and the docs have an explanation of steps to apply to your own site.
And then I applied it to my Dev Cheatsheets repo. A site with over 100 pages, nested in folders up to about four levels deep.
- Cheatsheets page
The approach I made uses breadcrumbs to help the user with navigation. And the templating is flexible so you can render the menu how you like, once you have the repo structured correctly with minimal
index.md pages at each level
The interface is neater for the cheatsheets repo - using flexbox and not just bullet points. I am thinking of other ways to add content to a sidebar or layout the menu in two columns instead of sections then pages. Any ideas would be appreciated.