# Here's my solution which I think is the best way to highlight the current page:
# Define a navigation list on your _config.yml like this:
navigation:
- title: blog
url: /blog/
- title: about
url: /about/
- title: projects
url: /projects/
# Then in your _includes/header.html file you must loop through the list to check if the current page (page.url) resembles any item of the navigation list, if so then you just set the active class and add it to the <a> tag:
<nav>
{% for item in site.navigation %}
{% assign class = nil %}
{% if page.url contains item.url %}
{% assign class = 'active' %}
{% endif %}
<a href="{{ item.url }}" class="{{ class }}">
{{ item.title }}
</a>
{% endfor %}
</nav>
<!--
And because you're using the contains operator instead of the equals = operator, you don't have to write extra code to make it work with URLs such as '/blog/post-name/' or 'projects/project-name/'. So it works really well.
P.S: Don't forget to set the permalink variable on your pages.
-->