Page 1 of 1
adding .last class to last item in menu
Posted: Wed Mar 19, 2008 3:10 am
by marksimo
Hi Everyone,
For styling purposes, I'm trying to find a way to add a .first class to the first link in a menu and a .last class to the last link.
I've been trying to change the code from simple_navigation.tpl and can't figure out the way to do this.
Any ideas?
Re: adding .last class to last item in menu
Posted: Wed Mar 19, 2008 3:11 am
by calguy1000
refer to the foreach section in
http://smarty.php.net/manual/en
it may help.
Re: adding .last class to last item in menu
Posted: Thu Mar 20, 2008 7:18 pm
by [DrAg]
Like to post some working code here, because I could not find any code example on this forum or wiki.
Code: Select all
{* CSS classes used in this template:
.current - The active page in the horizontal menu (first level).
.bullet_sectionheader - To style section header
hr.separator - To style the ruler for the separator *}
{if $count > 0}
<ul id="menu">
{foreach from=$nodelist item=node name=items}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true or $node->parent == true}
<li class="active"><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $smarty.foreach.items.last}
<li class="last"><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
<li><span class="bullet_sectionheader">{$node->menutext}</span>
{elseif $node->type == 'separator'}
<li style="list-style-type: none;"><hr class="separator" />
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-2}</li>
</ul>
{/if}
Re: adding .last class to last item in menu
Posted: Mon Mar 31, 2008 9:41 am
by webform
Hi DrAg
I've adapted your code with some succes - But i have changed some as i use it both for my main menu and a sub menu. The only problem i have is if the a page is the current and the last page in the menu it still shows the graphic. Isn't there some way to tell menumanager that something is both .last class and current?
My code:
Code: Select all
{if $count > 0}
<ul>
{foreach from=$nodelist item=node name=items}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true}
<li><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}id="current" name="current">{$node->menutext}</a>
{elseif $node->parent == true}
<li><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}id="currentAncestor" name="currentAncestor">{$node->menutext}</a>
{elseif $smarty.foreach.items.last}
<li class="last"><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}>{$node->menutext}</a>
{elseif $node->type == 'sectionheader'}
<li class="sectionheader">{$node->menutext}
{elseif $node->type == 'separator'}
<li class="separator" style="list-style-type: none;"> <hr />
{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}>{$node->menutext}</a>{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-2}</li>
</ul>
{/if}
I've tried to write this code but something is wrong with it - looks like it won't accept the AND operator or it's because it conflicts with the
Code: Select all
{elseif $smarty.foreach.items.last}
Code: Select all
{elseif $smarty.foreach.items.last and $node->current == true}
<li class="last"><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}id="current" name="current">{$node->menutext}</a>
Re: adding .last class to last item in menu
Posted: Mon Mar 31, 2008 5:29 pm
by Pierre M.
[DrAg] wrote:
Like to post some working code here, because I could not find any code example on this forum or wiki.
Thank you for sharing. Could you please post this in the wiki (using your forum account) rather than in the forum ? Feel free to contribue to the wiki.
http://wiki.cmsmadesimple.org/index.php ... nu_Manager
Pierre M.
Re: adding .last class to last item in menu
Posted: Mon Apr 14, 2008 9:02 am
by webform
OK i got a solution that is working
It was wrong to try to write an AND condition - instead i wrote:
Code: Select all
{if $node->current == true}
<li{if $smarty.foreach.items.last} class="last"{else}{/if}><a href="{$node->url}" {if $node->target ne ""}
target="{$node->target}"{/if}id="current" name="current">{$node->menutext}</a>
Much more simpel and saves some code lines.
Re: adding .last class to last item in menu
Posted: Mon Apr 14, 2008 1:21 pm
by duclet
Remove that else, you don't need it. {if $smarty.foreach.items.last} class="last"{/if} is enough.
Re: adding .last class to last item in menu
Posted: Mon Apr 14, 2008 1:31 pm
by webform
duclet wrote:
Remove that else, you don't need it. {if $smarty.foreach.items.last} class="last"{/if} is enough.
Doh! Your right
