tl;dr

Actually if is more like an “isDefined” in Hakyll you can just find out if a variable is set. So my solution to add the active class to the menu is quite simple:

1. Add a variable for every menu entry (blog, talks, contact, facts).
2. Set the variable to some value in the yaml front matter of the matching pages.
3. In the navigation partial check on every entry if the matching variable is set.
4. If so add the active class to the matching entry.

That’s it.

A walk through the code

Let’s make that a little more detailed, probably nobody understood it from the tl;dr anyway. I take the facts page to illustrate it, but it works the same for all the other entries.

Our journey starts at line 3 of the facts.html:

---
title: xinitrc facts
facts: true
---

The variable facts is initialised and set to true, as I already said the value is completely irrelevant, it suffices to add the variable at all. (I was actually tempted to set it to false but that would be outright evil.)

Next in Line 144ff of site.hs

match ("facts.html" .||. "contact.html" ) $ do
        route idRoute
        compile $ applyKeywords
                  >>= loadAndApplyTemplate "templates/main.html" (taggedPostCtx tags)

the facts page is matched and the templates/main.html is applied.

<di id="wrapper">
    $partial("partials/navbar.html")$

    <div class="contentwrapper">
        <div class="content">
            $body$
        </div>
    </div>

    $partial("partials/sidebar.html")$
</div>

Where in Line 6 the partials/navbar.html partial is requested for rendering. Which in line 16ff contains the following code.

<li>
    <a  $if(facts)$ class="active" $endif$ href="/facts.html">xinitrc facts<i class="icon-chevron-right con-large"></i></a>
</li>

This looks up if facts is defined, which it is, and therefor renders the class=“active”.

That’s it. I hope this helps and you find some use for it somewhere else.