Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Navigation als zweizeilige Navi aufbauen
#1
Hallo Forum,
manchmal hat man eine recht einfache - nicht sehr in die Tiefe gehende - Navigation aufzubauen. Wenn nun auch noch der Platz im Main-Bearbeitungs Bereich knapp ist, und man keinen Platz für eine Seiten-Navigation hat, kann man neben der Pull-Down-Navigation auch oft mit einer zweizeiligen Navigation klar kommen.

Wie man so etwas in Verbindung mit der YAML-Umgebung macht steht in der anhängenden Doku !

Anhang am 5.2.2011 aktualisiert um Beschreibung der CSS-Einbindung
Anhang am 8.2.2011 aktualisiert um Beschreibung der TypoScript Menü-Zustände
Anhang am 16.2.2011 aktualisiert wegen Fehler mit TopNavi (siehe auch Fehler-Beschreibung vom 16.2. weiter unten)


Angehängte Dateien
.pdf   Hauptnavi als 2-Zeilige Navigation.pdf (Größe: 207,18 KB / Downloads: 68)
Grüsse
Andi Angel
Zitieren
#2
Thumbs Up 
fast wie bestellt ;-D.

genau das, was ich jetzt brauche!
hab zwar jetzt 2h lang rumprobiert, aber da reichen wohl meine kenntnisse noch nicht ganz.
superdanke!

edit//

nochmals danke, hat einwandfrei funktioniert!

hab nur noch eine frage.

was muss ich machen damit der menüpunkt in der ersten ebene, der aktiv ist, nicht den css-stil wechselt, wenn ich eine der ebene2 menüs aktiviere, sondern erst, wenn ich einen anderen menüpunkt der 1. ebene neu aktiviere.

Zitieren
#3
Du hast Recht,
die Optik der Menü-Zustände habe ich noch nicht bearbeitet und vergessen.
Wer ich gleich mal nachholen und die Doku ergänzen.

Gib mir ein bißchen Zeit ...

Grüsse
Andi Angel
Zitieren
#4
keine hektik^^.
Zitieren
#5
Kleiner Tipp: Schau dir mal in der TSRef den Zustand ACT an Wink
Zitieren
#6
hm hab mir das in der tsref jetzt mal angesehen.

es gibt folgende befehle:

ACT = 1
setzt den aktiven zustand fest oder bezieht sich die 1 auf ebene 1?

ACT.wrapItemAndSub = <li class="irgendneklasse">|</li>
heisst soviel wie für den zustand ACT umschliesse dieses item und alle unteren mit der formatierung <li class="irgendneklasse">|</li>.

ich hab aber null plan wo ich den ganzen krempel unterbringen soll.
muss ich das sowohl in ebene 1 als auch ebene 2 im typoscript einbauen oder nur in einem der beiden?

konkret:
nachdem ich die zwei zeilen dazugefügt hatte, hats die menüleiste "zerschossen" (es wurden sowohl der erste angeteuerte menüpunkt als auch der zweite danach auf aktiv gesetzt und die menüleiste war doppelt so breit, als wäre die zweite menüleiste unterhalb der ersten ebene ständig vorhanden, obwohl aktuell nur ein menüpunkt eine zweite ebene besitzt.

ist halt mein altes problem, ich kann code nachvollziehen und verstehen, aber beim selber bauen raff ich garnix^^.


edit//

hm sowas in der art?
ACT < .NO
ACT=1
ACT{
allWrap = <li class="irgendneklasse">|</li>
doNotLinkIt = 1
}

ACTIFSUB < .NO
ACTIFSUB =1
ACTIFSUB {
allWrap = <li class="irgendnesubklasse">|</li>
doNotLinkIt = 1 // das müste eigentlich weg für ebene 1, wenn ebene2,menüpunkt xy aktiv ist, sonst könnte man ja den ersten nicht mehr anwählen.
}

aber wo und wie :-D???
Zitieren
#7
Da gibts noch ne ganze Menge mehr Zustände, die ausgewertet werden können / müssen. Dazu kommt, dass diese Zustände teilweise mit CSS-Eigenschaften kollidieren.
Desshalb war meine Aussage "das mach ich schnell noch" etwas vorschnell.
Ich hab das gleiche Thema - mit diesen Menü-Zuständen - auch mit dem PullDown Menü das ich gerade auf (S2) baue.
Hab noch ein paar Tage Geduld, dann kommt die Doku zu diesem Thema.

Da das Eine ohne das Andere nicht geht, bin ich auch gerade dabei das Thema Grafik in diesem Zusammenhang auseinander zu nehmen. Da gibt es auch eine Menge an Grundwissen, das man braucht, um gerade im CSS-Bereich die verschiedenen Möglichkeiten der Background-Grafik richtig nutzen zu können.
Ist ein hochinteressantes Thema.

Bin leider die nächsten Tage zeitlich etwas gehandicapt, weil ich bei der Ski-WM in Garmisch stark engagiert bin.

Grüsse
Andi Angel
Zitieren
#8
so hab mal folgendes probiert:
lib.navigation = HMENU

lib.navigation {
wrap = <ul>|</ul>

1 = TMENU
1 {
expAll = 1
NO = 1
NO {
allWrap = <li>|</li>
}
ACT = 1
ACT {
allWrap = <li class="active"><strong>|</strong></li>
doNotLinkIt = 1
}
}
2 < .1
}

lib.subnavigation = HMENU
lib.subnavigation {
wrap = <ul>|</ul>
entryLevel = 2
1 = TMENU
1 {
expAll = 1
NO = 1
NO {
allWrap = <li>|</li>
}
CUR = 1
CUR {
allWrap = <li class="active"><strong>|</strong></li>
doNotLinkIt = 1
}
}
}

in der ersten ebene hab ich einfach CUR mit ACT ausgetauscht.
einziges problem:
der aktive zustand der beim aufrufen der seite auf aktiv steht bleibt beim anwählen der anderen menüpunkte auch aktiv (und diese seite ist damit ledier nicht mehr aufrufbar...also nicht optimal ;-D).
aber ich komm der sache näher :-D.
Zitieren
#9
Dann lass doch mal CUR verlinkt, also entferne das doNotLinkIt. Natürlich musst du dann dein CSS anpassen.
Zitieren
#10
ja, check bloss nicht warum die navi-leiste dicker wird (fast doppelt so hoch), wenn ich das rauslösche? im css wird doch nur der text und der hintergrund mit anderer farbe versehen im verlinkten zustand.

das kam evtl. etwas undeutlich rüber, aber der aktive zustand bleibt dann immer noch im menü beim "home" button stehen. der soll ja weg, wenn ein untermenüpunkt einer anderen seite angeklickt wird.
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste