Page 1 of 1

[solved] Styling the Menu in Menu Manager

Posted: Mon Nov 12, 2007 2:58 am
by cyberpaws
This is probably right under my nose.... and I feel really stupid for asking this question.   

I'm running 1.1 and am trying to add a second menu in the sidebar.

I have this much:

I created a new Database template from the file templates and named it Test

I put the menu where I wanted it like this
{cms_module module='menumanager' template='Test' start_level="2" collapse="1" }

What I can't seem to figure out (and I'm sure it's right there in the notes and I'm just oblivious) is how to style that so I don't get the default bullets etc.. I want to change the color of the text etc..  do I create a new Stylesheet? 

Sorry to be so oblivious.

Re: Styling the Menu in Menu Manager

Posted: Mon Nov 12, 2007 4:19 am
by Dr.CSS
Depending on how the first one is targeted, #primary-nav or, you can use the div it is in or the id/class you may have given the ul in 'test' for some of the default stuff like no bullets I add it to the CSS for the other menu...

Say first is ul id of primary-nav and second is test...

#primary-nav, #test {list-style:none;margin:0px;padding:0px}

Re: Styling the Menu in Menu Manager

Posted: Mon Nov 12, 2007 2:34 pm
by cyberpaws
So, it doesn't need it's own stylesheet? 

I should have said that I'm using the Grass Stains theme... so I have a stylesheet for the header menu, the footer menu and the main template.  So, I guess I have to look closer at:

The template in the menu manager.  Added in "sidebar_nav" to the code I currently have.

Code: Select all

{if $count > 0}
<ul id="sidebar_nav">
{foreach from=$nodelist item=node}
{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}" class="active">{$node->menutext}</a>
{else}
<li><a href="{$node->url}">:  {$node->menutext}  :</a>{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-2}</li>
</ul>
{/if}
And then in my Stylesheet for my menu create

Code: Select all

#sidebar-nav ul {
padding:0;
margin:0;
white-space: nowrap;
font-size:8pt;
color:#000;
float:left;
list-style:none;
}

#sidebar-nav ul li {
margin: 0 0 0 0;
padding: 0 0 0 0;
color: #000000;
text-decoration:none;
float: left;
}
Would that do it?  Just to match the CSS to the Menu manager... I know I have to tweak the stying yet..