Page 1 of 1

Menu with different colors needed

Posted: Tue Aug 09, 2011 10:41 pm
by nembrionic
I have included an example of what I need but I'm not sure how to get it to work.

Basically, I need 4 main menu items + children, but these should have different colors per category.

As you know, CMSms simply loops through everything and then generates the menu. Is it possible to use the Menu Manager to make the thing I want? Perhaps using counters and some extra CSS?

For the life of me I have no idea how to make it work.

I'm currently using the supplied "cssmenu.tpl":

Code: Select all

{* CSS classes used in this template:
#menuwrapper - The id for the <div> that the menu is wrapped in. Sets the width, background etc. for the menu.
#primary-nav - The id for the <ul>
.menuparent - The class for each <li> that has children.
.menuactive - The class for each <li> that is active or is a parent (on any level) of a child that is active. *}
{if $count > 0}
<div id="menuwrapper">
<ul id="primary-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string='<ul class="unli">' 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->parent == true or ($node->current == true and $node->haschildren == true)}
<li class="menuactive menuparent">
<a class="menuactive menuparent" {elseif $node->current == true}
<li class="menuactive">
<a class="menuactive" {elseif $node->haschildren == true}
<li class="menuparent">
<a class="menuparent" {elseif $node->type == 'sectionheader' and $node->haschildren == true}
<li class="sectionheader"><span class="sectionheader">{$node->menutext}</span>{elseif $node->type == 'separator'}
<li style="list-style-type: none;"> <hr class="menu_separator" />{else}
<li>
<a {/if}
{if $node->type != 'sectionheader' and $node->type != 'separator'}
{if $node->target}target="{$node->target}" {/if}
href="{$node->url}"><span>{$node->menutext}</span></a>
{elseif $node->type == 'sectionheader'}
><span class="sectionheader">{$node->menutext}</span></a>
{/if}
{/foreach}
{repeat string='</li></ul>' times=$node->depth-1}
</li>
</ul>
<div class="clearb"></div>
</div>
{/if}

Anyone? Any help will be greatly appriciated :)

Cheers,
Eric

Re: Menu with different colors needed

Posted: Tue Aug 30, 2011 1:07 pm
by johnflan
I too am looking for something like this, so if anyone has a bright idea please let us know.

I'm updating an old website http://www.stmarysblackburn.ac.uk/ where the top level menu tabs were hard coded - not an elegant solution but it worked.

Re: Menu with different colors needed

Posted: Tue Aug 30, 2011 1:11 pm
by Rolf
A quick search in the forum:
http://forum.cmsmadesimple.org/viewtopi ... =8&t=38665

grtz. Rolf

Re: Menu with different colors needed

Posted: Tue Aug 30, 2011 2:27 pm
by johnflan
Thanks for you're quick reply. There's also this solution by Uniqu3 which I found v easy to apply:
http://forum.cmsmadesimple.org/viewtopi ... color+menu