StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>In the current version of MM (2.x, though 3.0 is close), you can do it with the following additions to <code>config.rb</code> and some tweaks in your nav file(s). Here is <a href="https://github.com/agamz/FindBigMail-old/blob/master/config.rb">a working version</a> in case I leave out some critical bits:</p> <p>First create a helper function:</p> <pre><code>helpers do def nav_active(page) @page_id == page ? {:class => "Active"} : {} end end </code></pre> <p>Then, in the <a href="https://github.com/agamz/FindBigMail-old/blob/master/source/_top_navigation.haml">nav bar include file</a> (in this case its a haml file) you can use the <code>nav_active</code> helper as follows:</p> <pre><code>#HeaderNavigationBar %ul %li{nav_active("index")}= link_to t('top_navigation.home'), t('paths.index') %li{nav_active("pricing")}= link_to t('top_navigation.pricing'), t('paths.pricing') %li{nav_active("faq")}= link_to t('top_navigation.faq'), t('paths.faq') </code></pre> <p>The net result of this is to add the class "Active" to the link in the nav bar when the page is building built for this page. I.e. if the page is a file called "index" then the <code>@page_id</code> will be "index" and that link will have the Active theme.</p> <p>To complete the example, here is the excerpt from the <a href="https://github.com/agamz/FindBigMail-old/blob/master/source/stylesheets/_site.scss">scss style partial</a> that defines active:</p> <pre><code>&.Active { font-weight: bold; } </code></pre> <p>In a later version of the header file, we actually removed the link when on the active page. It looks something like - which could clearly be tidied up, but FWIW :D:</p> <pre><code>%li{nav_active("index")} -if "index" == @page_id = t('top_navigation.home') -else = link_to t('top_navigation.home'), root() ... (etc) </code></pre> <p>Note that all the t('stuff') has to do with translation functions for i18n. You can ignore that. I didn't want to make the example syntactically wrong by trying to remove them.</p> <p>Hope this helps - also see the forum at <a href="http://forum.middlemanapp.com/">http://forum.middlemanapp.com/</a>.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload