Menu icon Foundation
Conditionals Foundation Templates

Is there any example documentation about extending the master templates with Handlebars conditionals (http://handlebarsjs.com/block_helpers.html#conditionals)?

My goal is to have some sort of IF/Else page equals or doesn't equal this name, so I can make the navigation item output the active class.

<!-- 
    Example when user is on the About page, 
    the nav item for about would contain the class active
-->
<nav class="site-nav" role="navigation">
    <ul>
        <li><a>Home</a></li>
        <li><a class="active">About</a></li>
        <li><a>Contact</a></li>
    </ul>
</nav>
            

         

conditionallogicHandlebarstemplatessites

Is there any example documentation about extending the master templates with Handlebars conditionals (http://handlebarsjs.com/block_helpers.html#conditionals)?

My goal is to have some sort of IF/Else page equals or doesn't equal this name, so I can make the navigation item output the active class.

<!-- 
    Example when user is on the About page, 
    the nav item for about would contain the class active
-->
<nav class="site-nav" role="navigation">
    <ul>
        <li><a>Home</a></li>
        <li><a class="active">About</a></li>
        <li><a>Contact</a></li>
    </ul>
</nav>
            

         
Rafi Benkual over 3 years ago

Yes! There is if you're using the ZURB dev stack. Panini has a helper.

Based on layout you can selectively include html

Example:

    {{#ifequal layout '404'}}
    <li class="topbar-title"><a class="zurb-logo" href="{{root}}index.html">
    <img src="/assets/img/zurb-logo.svg" alt="ZURB"> Foundation</a></li>
    {{else}}
    <li class="topbar-title"><a class="zurb-logo" href="{{root}}index.html">
    <img src="{{root}}assets/img/zurb-logo.svg" alt="ZURB"> Foundation</a></li>
    {{/ifequal}}