Hallo,
ich bin beinahe am Verzweifeln, da ich eine bestimmte Navigation für Seiten haben möchte.
Leider kann ich php nicht gut genug, als dass ich es hinbekomme.
Ist so etwas mit Wordpress möglich? (siehe Bild)
http://img1.bildupload.com/d1d6951805c04e…a34bedc7274.jpg
Die große grüne Navi ist die Hauptnavi, die immer erscheinen soll. Wenn man auf einen Navi-Punkt klickt, öffnet sich mit einer neuen Seite die Subnavigation. Gerne kann sich das auch dynamisch öffnen, ohne dass erst eine neue Unterseite geladen werden muss, aber das ist ja noch schwieriger.
Und wenn eine der Unterseiten nochmals Unterseiten hat, sollen sich diese auch bei entsprechendem Klick öffnen und so wie auf dem Bild dargestellt werden. Wichtig ist, dass die Subnavis erst bei einem Klick auf entsprechenden Elternlink angezeigt werden sollen.
Ich wäre wirklich dankbar für jegliche Hilfe.
Das einzige, was ich bisher hinbekommen habe, war dass sich die Subnavis öffnen, aber unten angehängt an das Menü und nicht direkt unter den einzelnen grünen Navi-Punkt. Und das hat auch nur mit den Kindseiten funktioniert, mit den Enkelseiten dann nur mit den CSS-Werten von den Kindseiten, also nicht nochmal extra verschachtelt mit pinker Schrift usw.
Also es ist alles mit Listen sauber in CSS programmiert, es geht nur darum, dass es in Wordpress automatisch mit den Unterseiten funktioniert.
Hier alternativ noch HTML- und CSS-Code:
<ul id="navigation">
<li><a href="http://www.web-spirit.de">Home</a></li>
<li><a href="/leistungen">Philosophie</a></li>
<li><a href="/kontakt">Coaching</a></li>
<li><a href="/kontakt">Tipps</a></li>
<ul id="subnavigation">
<li><a href="http://www.web-spirit.de">Home</a></li>
<li><a href="/leistungen">Philosophie</a></li>
<li><a href="/kontakt">Coaching</a></li>
<li><a href="/kontakt">Tipps</a></li>
<ul id="subnavigation2">
<li><a href="http://www.web-spirit.de">Home</a></li>
<li><a href="/leistungen">Philosophie</a></li>
<li><a href="/kontakt">Coaching</a></li>
<li><a href="/kontakt">Tipps</a></li>
<li><a href="/kontakt">Ferienangebote</a></li>
<li><a href="/kontakt">Turniere</a></li>
<li><a href="/kontakt">Über uns</a></li>
</ul>
<li><a href="/kontakt">Ferienangebote</a></li>
<li><a href="/kontakt">Turniere</a></li>
<li><a href="/kontakt">Über uns</a></li>
</ul>
<li><a href="/kontakt">Ferienangebote</a></li>
<li><a href="/kontakt">Turniere</a></li>
<li><a href="/kontakt">Über uns</a></li>
</ul>ul#navigation{
list-style-type:none;
margin:0 0 0 0;
padding:0 0 0 0;
}
ul#navigation li{
margin-bottom:1px;
}
ul#navigation li a{
background-color:#c0d83a;
display:block;
width:170px;
height:25px;
color:#191919;
text-transform:uppercase;
font-weight:normal;
font-size:20px;
text-decoration:none;
padding-top:5px;
padding-right:5px;
padding-bottom:5px;
text-align:right;
}
ul#navigation li a:hover{
background:#ff2c8d;
}
ul#navigation li a:active{
background:#ff2c8d;
}
/*Sub-Navigation*/
ul#subnavigation{
list-style-type:none;
margin:0 0 1px 0;
padding:0 0 2px 0;
border-bottom:2px solid #191919;
border-top:2px solid #191919;
}
ul#subnavigation li{
margin:0 0 0 0;
}
ul#subnavigation li a{
display:block;
width:170px;
height:15px;
color:#191919;
font-weight:normal;
font-size:12px;
text-decoration:none;
padding-top:5px;
padding-bottom:5px;
padding-right:5px;
text-align:right;
text-transform:none;
background:none;
}
ul#subnavigation li a:hover{
text-decoration:underline;
background:none;
}
ul#subnavigation li a:active{
text-decoration:underline;
background:none;
}
/*Sub-Navigation - Ebene 2*/
ul#subnavigation2{
list-style-type:none;
margin:5px 0 1px 20px;
padding:0 0 1px 0;
border-bottom:1px solid #191919;
border-top:1px solid #191919;
}
ul#subnavigation2 li{
margin:0 0 0 0;
}
ul#subnavigation2 li a{
display:block;
width:150px;
height:15px;
color:#ff2c8d;
font-weight:bold;
font-size:11px;
text-decoration:none;
padding-top:2px;
padding-bottom:2px;
padding-right:5px;
text-align:right;
text-transform:none;
background:none;
}
ul#subnavigation2 li a:hover{
text-decoration:underline;
background:none;
}
ul#subnavigation2 li a:active{
text-decoration:underline;
background:none;
}Danke schonmal für jegliche Hilfe! Ich habe schon ziemlich viel gegoogelt und probiert, aber es funktioniert einfach nicht. :cry: