Jekyll - Automatically highlight current tab in menu bar

Question

I am using github to host a static site and Jekyll to generate it.

I have a menu bar (as

) and would like the
• correspo

Answer 1

Lot of good answers are already there.

Try this.

I slightly alter the above answers.

_data/navigation.yaml

- name: Home
  url: /
  active: home
- name: Portfolio
  url: /portfolio/
  active: portfolio
- name: Blog
  url: /blog/
  active: blog

In a page -> portfolio.html (Same for all pages with a relative active page name)

---
layout: default
title: Portfolio
permalink: /portfolio/
active: portfolio
---


  
Portfolio

Navigation html part

  {% for item in site.data.navigation %}
    

      {% if {{page.active}} == {{item.active}} %}
        {{ item.name }}
      {% else %}
        {{ item.name }}
      {% endif %}
    
  {% endfor %}