Example of active state navigation in Jekyll

header.html

<nav class="masthead-nav">
  <a class="{% if page.title == "About" %}active {% endif %}tooltipped tooltipped-s" href="{{ site.baseurl }}/about" aria-label="About this site.">About</a>
  <a class="{% if page.title == "Process" %}active {% endif %}tooltipped tooltipped-s" href="{{ site.baseurl }}/process" aria-label="Working with us.">Process</a>
  <a class="{% if page.title == "Capabilities" %}active {% endif %}tooltipped tooltipped-s" href="{{ site.baseurl }}/capabilities" aria-label="What we can do.">Capabilities</a>
  <a class="{% if page.title == "Team Docs" %}active {% endif %}tooltipped tooltipped-s" href="{{ site.baseurl }}/team-docs" aria-label="How we do what we do.">Team Docs</a>
  <a class="{% if page.title == "Project Leads" %}active {% endif %}tooltipped tooltipped-s" href="{{ site.baseurl }}/project-leads" aria-label="Who's leading your project?">Project Leads</a>
</nav>