https://github.com/jnvsor/jekyll-dynamic-menu

A dynamically generated hierarchical menu in jekyll without plugins
https://github.com/jnvsor/jekyll-dynamic-menu

Last synced: about 1 month ago
JSON representation

A dynamically generated hierarchical menu in jekyll without plugins

• Host: GitHub
• URL: https://github.com/jnvsor/jekyll-dynamic-menu
• Owner: jnvsor
• License: gpl-2.0
• Created: 2015-06-29T20:52:48.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2016-07-25T21:11:30.000Z (over 8 years ago)
• Last Synced: 2023-08-03T05:23:59.279Z (over 1 year ago)
• Language: CSS
• Size: 37.1 KB
• Stars: 9
• Watchers: 2
• Forks: 11
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# jekyll-dynamic-menu

It's a dynamic menu for jekyll.

[DEMO](http://jnvsor.github.io/jekyll-dynamic-menu/about/)

## Features

* Dynamically generated or custom from JSON/YAML/CSV

* Hierarchical

    * Generates nested menu items

    * Unfolds them when opened

    * Unfold all with a simple include parameter to control the menu with javascript (Or make a null layout page and request it with ajax or something)

* Styled

    * Menus and submenus have class `menu`

    * Menu items have classes `leaf`, `branch`, `open`, `closed`, `selected`, and `active` depending on state.

    * The demo shows what you can do with these:

        * The active path is *italicized*

        * The selected menu item is **bold**

        * The icons depict the leaf/branch/open/closed state

    * Data mode lets you add custom classes at will

* No plugins

    * No plugin dependancies - it just works TM

    * This means it will work on github pages

## Usage

### automenu

1. add [automenu](_includes/automenu) into your _include folder,

2. insert `{% include automenu url='/' sort="url" reverse=false all=false %}` into your code where automenu needed.

### datamenu

1. add [datamenu](_includes/datamenu) into your _include folder,

2. add your [json](_data/menu.json) or yaml menu [data file](https://jekyllrb.com/docs/datafiles/),

3. insert `{% include datamenu menu=site.data.menu all=false %}` into your code where datamenu needed.