Druckbare Version
Hallo alle zusammen,
ich würde gerne das im Anhang dargestellte Menü mit Typolight umsetzten.
Kann man da jemand ein paar Tips geben.
Danke schööön..
Meolo
Ach ja, hier die Seite:
Nur Template noch keine Insert-tags etc. eingefügt.
http://ac-italia.meolo.de
Oops, hat sich erledigt.
Hatte einen Tippfehler im Template, drum ging das nicht.
Ich teste mal weiter.
Neues Problem:
Der Menüpunkt, 1. und 2., wird leider nicht als aktive angezeigt.
Habe schon ein wenig mit .trail probiert, hat sich aber nichts geändert.
hier die CSS der Navigation:
und hier das Nav-Template:PHP-Code:/*-------------------------- NAVIGATION PART --------------------------*/
div#navigation-bg{
height:66px; background:url(images/navigation-bg.gif) 0 0 repeat-x;
}
div#navigation-bg div#navigation{
width:922px; margin:0 auto;
}
div#navigation-bg div#navigation ul.mainMenu{
padding:0; float:left; width:567px;
}
div#navigation-bg div#navigation ul.mainMenu li{
width:81px; float:left;
background:url(images/navigation-divider.gif) 100% 0 no-repeat;
}
div#navigation-bg div#navigation ul.mainMenu li a{
width:80px; height:33px; display:block;
line-height:33px; text-align:center;
font-weight:bold; color:#FAF0C2; font-size:11px;
background-color:inherit;
}
div#navigation-bg div#navigation ul.mainMenu li a:hover{
background:url(images/navigation-bg-selected.gif) 0 0 no-repeat;
}
div#navigation-bg div#navigation ul.mainMenu li a.selectMenu {
width:80px; height:33px; display:block;
line-height:33px; text-align:center;
font-weight:bold; color:#FAF0C2; font-size:11px;
background:url(vorlagen/fss-01/images/navigation-bg-selected.gif) 0 0 no-repeat;
background-color:inherit;
}
/*-------------------------- DROP DOWN MENU STARTS --------------------------*/
ul.subNav{
font:normal 11px/12px Arial, Helvetica, sans-serif;
padding:4px 0 0 0;
}
ul.subNav li{
background:url(images/navigation-dropdown-divider.gif) 0 0 no-repeat;
height:17px; float:left; padding:6px 0 0 0;
}
ul.subNav li a{
display:block; margin:0 22px 0 20px;
color:#84915D;
background-color:inherit;
}
ul.subNav li a:hover{
color:#fff;
background-color:inherit;
}
/*-------------------------- DROP DOWN MENU ENDS --------------------------*/
PHP-Code:<ul class="mainMenu">
<?php foreach ($this->items as $item): ?>
<?php if ($item['isActive']): ?>
<li class="current"><a href="<?php echo $item['href']; ?>"><b><?php echo $item['title']; ?></b></a></li>
<?php else: ?>
<li><a href="<?php echo $item['href']; ?>"><b><?php echo $item['title']; ?></b></a></li>
<?php endif; ?>
<?php endforeach; ?>
</ul>
Hallo Meolo,
bin zwar auch kein CSS Meister, aber ich kann mitlerweile mit Firefox und Firebug umgehen ;) Solltest Du Dir auch mal ansehen. Denn da kann man live mit dem CSS spielen und so dann schnell Fehler finden oder testen wie es aussieht.
versuch es mal damit:
GrußCode:div#navigation-bg div#navigation ul.mainMenu li a:hover, div#navigation-bg div#navigation ul.mainMenu li current a{
background:url(images/navigation-bg-selected.gif) 0 0 no-repeat;
}
Oliver
Hallo Meolo,Zitat:
Zitat von Meolo
du hast in deiner CSS ja gar keine Definitionen für den aktiven Punkt, welchen du in deinem Template von active in current geändert hast. Auch hast du in deinem Template soviel von dem default-Template rausgeschmissen, dass dir trail z.B. gar nicht mehr generiert wird. Das B Element solltest du auch daraus entfernen und über CSS formatieren. Überlege auch, ob du den Menüpunkt der aktiven Seite wirklich auch als Link darstellen möchtest, default wird er in einem SPAN Element dargestellt.
Mein Tipp: Nimm wieder das default Template nav_default.tpl und stelle die anzuzeigenden Ebenen über das Navigationsmodul im BE ein. Dann mit Hilfe von firebug solange formatieren, bis es passt.
Andreas