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?
adding .last class to last item in menu
-
- Support Guru
- Posts: 8169
- Joined: Tue Oct 19, 2004 6:44 pm
- Location: Fernie British Columbia, Canada
Re: adding .last class to last item in menu
Follow me on twitter
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
Please post system information from "Extensions >> System Information" (there is a bbcode option) on all posts asking for assistance.
--------------------
If you can't bother explaining your problem well, you shouldn't expect much in the way of assistance.
Re: adding .last class to last item in menu
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
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:
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
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}
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
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.[DrAg] wrote: Like to post some working code here, because I could not find any code example on this forum or wiki.
http://wiki.cmsmadesimple.org/index.php ... nu_Manager
Pierre M.
Re: adding .last class to last item in menu
OK i got a solution that is working 
It was wrong to try to write an AND condition - instead i wrote:
Much more simpel and saves some code lines.

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>
Re: adding .last class to last item in menu
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
Doh! Your rightduclet wrote: Remove that else, you don't need it. {if $smarty.foreach.items.last} class="last"{/if} is enough.
