After searching how to highlight the current menu item in jekyll just to find too complex answers on stackoverflow, i decided to do a quick-tip on this topic.
Consider following markup:
This loops over all pages and puts them in a list. To put an active class on the current link we need a way to compare the current page to the pages in the loop.
This is where the jekyll
page variable comes in. In this variable jekyll stores the page being rendered and all the variables which are set
in the front matter. I’m using the title variable to compare my current post to the posts in the loop.
After extending the above code it looks like this.
Alternatively, for an even quicker solution, it’s possible to just compare the pages. Which produces the same results.
Quick two minute solution which works quite nice and should be easy extensible.