Page 1 of 1

showing child menu items and bolding external links

Posted: Fri May 16, 2008 3:37 pm
by dpakman91
let's say i have a parent like "videos" in my menu, and inside of it are three subtopics. how can i make it so the three subtopics show by default in the menu without first having to click the parent link?

also, how can i make all external links appear as bold text?

Re: showing child menu items and bolding external links

Posted: Fri May 16, 2008 6:03 pm
by Nullig
To show all menu items, you could add:

collapse='0'

to the menu call in your template.

To bold external links, enclose them in or or add:

a.external {font-weight: bold;}

to your stylesheet.

Nullig

Re: showing child menu items and bolding external links

Posted: Fri May 16, 2008 6:17 pm
by dpakman91
where would i add collapse="0"?

additionally, what if i just want to show all menu items that are child to ONE menu section, but not another?

Re: showing child menu items and bolding external links

Posted: Fri May 16, 2008 6:22 pm
by Nullig
You add it within the {menu} tag in your template.

I suggest you read the help for Menu Manager, it explains exactly how to format your menu.

Nullig

Re: showing child menu items and bolding external links

Posted: Fri May 16, 2008 6:48 pm
by dpakman91
alright. if i want to create a section header, but have it be formatted just like my regular menu items, just not include any content, how would i do that? basically just make a section header have the same font and look as regular menu items that are content pages.

Re: showing child menu items and bolding external links

Posted: Sat May 17, 2008 4:16 am
by Dr.CSS
Add it as a page then when you render a page, look at it in a browser, look at the page source to see how it is called in the menu template, ID or class etc., then use that to add a style in your CSS tagging it using the same CSS as your regular menu items, copy/paste the normal CSS then put the section header call/ID/class in front of it...

Re: showing child menu items and bolding external links

Posted: Sat May 17, 2008 10:23 pm
by dpakman91
mark wrote: Add it as a page then when you render a page, look at it in a browser, look at the page source to see how it is called in the menu template, ID or class etc., then use that to add a style in your CSS tagging it using the same CSS as your regular menu items, copy/paste the normal CSS then put the section header call/ID/class in front of it...
i know i'm new at this, but i don't understand exactly what you mean. can you tell me in a little more detail?

Re: showing child menu items and bolding external links

Posted: Sun May 18, 2008 6:08 am
by Dr.CSS
Lets say you use the simple_navigation template the current page is set as an h3...

{if $node->current == true}
Current page is {$node->hierarchy}: {$node->menutext}

The sectionheader is set as li.sectionheader with just text no wrap...

{elseif $node->type == 'sectionheader'}
{$node->menutext}

The default CSS for a shows...

div#menu_vert a {
  text-decoration:none; /* no underline for links */
  display: block; /* IE has problems with this, fixed above */
  padding: 0.8em 0.5em 0.8em 1.5em; /* some air for it */
  color: #18507C; /* this will be link color for all levels */
  background: url(images/cms/arrow-right.gif) no-repeat 0.5em center;
  min-height:1em; /* Fixes IE7 whitespace bug */
}

And the others are...


Current page first level...

div#menu_vert ul h3 {
  background: url(images/cms/arrow-right-active.gif) no-repeat 0.4em center;
  background-color: #385C72;
  display: block;
  padding: 0.8em 0.5em 0.8em 1.5em;  /* some air for it */
  color: #fff;                                /* this will be link color for all levels */
  font-size: 1em;                          /* instead of the normal font size for */
  margin: 0;                                  /* as normally has some margin by default */
}

/*
next level current pages, more padding,
smaller font and no background color or bottom border
*/
div#menu_vert ul ul h3 {
  font-size: 90%;
  padding: 0.3em 0.5em 0.3em 2.8em;
  background-position: 1.4em center;
  background-color: transparent;
  border-bottom: none;
  color: #000;   
}

/* current page on third level, more padding */
div#menu_vert ul ul ul h3 {
  padding: 0.3em 0.5em 0.3em 4.3em;
  background: url(images/cms/arrow-right-active.gif) no-repeat 2.7em center;
}

/* section header */
div#menu_vert li.sectionheader {
  border-right: none;
  font-size: 130%;
  font-weight: bold;
  padding: 1.5em 0 0.8em 0;
  background-color: #fff;
  line-height: 1em;
  margin: 0;
  text-align:center;
}

So if you want them all the same copy the one you like and paste it where the others are...