Page 1 of 1
menu with different colors per section
Posted: Wed 18. Jun 2008, 11:20
by E.A.Murphy
Hi,
I searched the forum for a solution (I thought I saw that some time ago) but can't find it anymore.
By now I tried to use: {NAV_HORIZ_DD:ID,Level depth} and read the thread of course.
So the problem is, what I need is this:
But what I got is far from that.
The biggest problem are the colors but I also don't get the spacing between the buttons.
btw. the drobdown-section will be only some grayish blocks maybe whith a colored line above. but I think I can achieve that.
The CSS is almost the same as the original
Code: Select all
#menu_container {
margin: 0 0 0 0; /* 100px only for testing - default = 0 */
position: relative;
width: 735px;
height: 21px; /* ORG 20px */
z-index: 1000;
}
/* Get rid of the margin, padding and bullets in the unordered lists */
/* margin und padding auf 0, Aufzählungszeichen der unsortierten Liste unterdruecken */
#pmenu, #pmenu ul {
padding: 0;
margin: 0;
list-style-type: none;
}
/* Set up the link size, color and borders */
/* Einstellen der Groeszen, Farben und Rahmen fuer die Links */
#pmenu a, #pmenu a:visited {
display: block;
/* width: 120px;
*/ font-size: 13px;
font-weight:bold;
color: #fff;
height: 21px; /* ORG 25px */
line-height: 20px; /* ORG 24px */
text-decoration: none;
text-indent: 0px;
border: #3b3bcc solid;
border-width: 3px 0px 0px 0px;
}
Maby someone can show me where I have to look (I think I use the wrong key-words)
Do I have to use frontend_render? (well, I'm not so into code)
Thanks
Murphy
Re: menu with different colors per section
Posted: Wed 18. Jun 2008, 16:20
by E.A.Murphy
or in other words: how do I get different CSS-IDs for the first level of the menu like:
Code: Select all
a.marketing:hover, a.marketing:active
{
color: #ffffff;
background: etc.
???
Wrapped in an div-element
Re: menu with different colors per section
Posted: Wed 18. Jun 2008, 17:25
by Jensensen
somewhere documented by flip-flop:
[x]
ah, it was here:
[x]
Re: menu with different colors per section
Posted: Wed 18. Jun 2008, 18:01
by E.A.Murphy
Thank you, its not quite what i want (but I'll read it throught and take it as backup)
flip-flop wrote in his NAV_HORIZ_DD
- Every li has it´s own class (optional)
but I can't find a workaround - think I have to search some more...
Maybe someone has tried such a menu with phpwcms already
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 09:09
by flip-flop
Mhh, I haven´t do it with this navigation but there is an commented part:
// IDs for every li ======= If you need the ID class, please uncomment/comment
// IDs fuer jedes li ======= Wenn sie die ID Klassen benoetigen, bitte dekommentieren/kommentieren
// $l = str_repeat(' ', $counter+1) . '<li'. $class . ' id="cat-id_' . $value['acat_id'] . '">';
If you uncomment this, every li becomes his own ID.
Knut
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 10:16
by E.A.Murphy
didn't see the forrest for the trees

So I'll give that a try. Thank you! (Think I'll be here again soon enough)
cheers
Sven
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 11:53
by Jensensen
Hi flip-flop,
Code: Select all
{NAV_LIST_UL:F,ID,,act_path,active,id}
works perfect!
but how to get it with the famous --> Level Lift??
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 12:38
by flip-flop
I don´t understand your question:
[PHP]
if(isset($GLOBALS['LEVEL_ID'][1])) {
$level_id = $GLOBALS['LEVEL_ID'][1];
echo '<div class="nlu_navi1">'.LF;
echo '{NAV_LIST_UL:F,'.$level_id.',,act_path,active,id}';
echo '</div>';
}
[/PHP]
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 13:20
by Jensensen
Thank you very much. I thought it was NAV_LIST_UL:F,ID,... that makes the navi handle with ID's.
So, it's rather the last part of the RT: ,id}
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 13:48
by E.A.Murphy
So, I uncommented the code in PHP as flip-flop sugested.
And the CSS is unchanged.
But it seams that there is no ID rendered (in FF). What I don't understand is that the "kontakt" is rendered with -class="horiz_enclose"- but It's part of the first menu-level.
FF-render:
Code: Select all
<ul id="pmenu">
<li class="sub_no act_path"><a href="index.php?home">home</a></li>
<li class="drop_ul "><a href="index.php?mana">mana<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li class="sub_no"><a href="index.php?langer-seitentitel" class="horiz_enclose">langer seitentitel</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="sub_no"><a href="index.php?marketing">marketing</a></li>
<li class="sub_no"><a href="index.php?personal-planning">personal planning</a></li>
<li class="sub_no"><a href="index.php?seminare">seminare</a></li>
<li class="sub_no"><a href="index.php?kontakt" class="horiz_enclose">kontakt</a></li>
</ul>
So everithing is as seen in flip-flops thread, beside that the code for IDs is uncomented.
Is there something that I don't see?
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 14:19
by flip-flop
Oh God, please:
Code: Select all
$l = str_repeat(' ', $counter+1) . '<li'. $class . ' id="cat-id_' . $value['acat_id'] . '">';
// $l = str_repeat(' ', $counter+1) . '<li'. $class . '>';
// IDs for every li ======= If you need the ID class, please uncomment/comment
Re: menu with different colors per section
Posted: Thu 19. Jun 2008, 15:16
by E.A.Murphy
Sorry, I'm a bit absent-minded.
That's much better
Code: Select all
<ul id="pmenu">
<li class="sub_no act_path" id="cat-id_1"><a href="index.php?home">home</a></li>
<li class="drop_ul " id="cat-id_2"><a href="index.php?mana">mana<!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<ul>
<li class="sub_no" id="cat-id_7"><a href="index.php?langer-seitentitel" class="horiz_enclose">langer seitentitel</a></li>
</ul>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<li class="sub_no" id="cat-id_3"><a href="index.php?marketing">marketing</a></li>
<li class="sub_no" id="cat-id_4"><a href="index.php?personal-planning">personal planning</a></li>
<li class="sub_no" id="cat-id_5"><a href="index.php?seminare">seminare</a></li>
<li class="sub_no" id="cat-id_6"><a href="index.php?kontakt" class="horiz_enclose">kontakt</a></li>
</ul>