Zum Inhalt springen

Verschiedene Farben in der Navigation

Erstellt am 24. August 2006 · 5 Antworten · letzte Antwort am 25. August 2006

Tags: Frage

valentina ·

Hallo zusammen!

Habe wieder einmal ein Problem, wobei ich dies erreichen möchte:
Meine ganze Navigation ist in grauer Farbe dargestellt. Wenn ein Navigationspunkt aktiv ist, soll er dann in verschiedenen Farben erscheinen.

z.B.
Punkt 1
Punkt 1.1
Punkt 2
Punkt 2.1
Punkt 3
Punkt 3.1

Punkt 1 soll im aktiven Zustand die rote Farbe haben, Punkt 2 blaue und Punkt 3 grüne (die Unterseiten sollen im aktiven Zustand die gleiche Farbe wie die Hauptseiten haben), ansonsten sollen alle Punkte im normalen Zustand die Standard-Farbe (grau) haben.

Wäre wirklich für jede Hilfe froh... Weiss nicht mehr weiter! 😢

valentina

Unbekannter Benutzer ·

Entweder du benutzt OptionSplit, oder du suchst mal nach Menü durchnummerieren und benutzt die Nummerierung nicht zur Ausgabe, sondern um jedem Punkt eine Klasse mit seiner Nummer zu geben.

toyde ·

Mit optionSplit kannst Du Navigationspunkte beliebig wrappen (z.B. mit Tags, Klassen, etc.). Dies funktioniert sowohl bei ACT, als auch NO. Mit der entsprechenden Syntax solltest Du etwas anfangen können.

..wrap = <div id="farbe1">|</div> |*| <div id="farbe2">|</div> || <div id="farbe3">|</div> |*| <div class="farbenormal">|</div>

Nur ein Beispiel, entsprechend anpassen. Im Forum findest Du viele Informationen dazu.

grüsse

valentina ·

Danke euch vielmals!!

Hat mir viel geholfen... In der ersten Ebene funktioniert es ausgezeichnet! Doch in der zweiten und dritten funktioniert dieses System nicht mehr ganz, da ich nicht nur eine Unterseite habe, sondern mehrere (und es können noch dazukommen).

Gruss
Valentina

toyde ·

Du kannst evtl. mit einer condition Abhilfe schaffen. Falls eine der drei ID's der betroffenen Hauptseiten erkannt wird, soll Unterebene alternativ behandelt werden (z.B. Alles blau unterhalb blauem Hauptnavi-Punkt).

ungefährer Ansatz:

### Standard-Formatierung
temp.mycolor = TEXT
temp.mycolor.value = <div class="menu-standard">|</div>

### Extra-Formatierung je Wunschpage
[globalVar = TSFE:id = 10]
temp.mycolor.value >
temp.mycolor.value = <div id="menu-blau">|</div>
[globalVar = TSFE:id = 44]
temp.mycolor.value >
temp.mycolor.value = <div id="menu-rot">|</div>
[global]
..
..

###im Navigations-Code
..menu.2.NO {
 wrap < temp.mycolor
}

» https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/Conditions/Index.html#condition-function-getenv

Hoffe wird klar, was ich meine. Vor condition Temp-Objekt mit Information für Standard-Formatierung. In condition wird eine Extra-Formatierung ermittelt und bei Zutreffen überschrieben. Im Navi-Teil die Information reinkopieren.
Tipp nebenbei: condition nicht innerhalb geschweifter Klammern setzen.
Ausserdem: ID/Class bei einzelnen/mehreren Navipunkten für's CSS beachten. Oder gleich alles mit "class" festlegen.

Bei x Unterebenen kannst Du den Gedanken weiterspinnen, und die condition mit weiteren Temp-Objekten je Unterlevel ergänzen - falls mehrere Klassen für die Formatierung via CSS notwendig sind.

Vielleicht gibt's im Forum auch alternative Wege. Suche nach "farbwechsel" oder "menu farben", etc..

grüsse