Bestimmten Menüpunkt anders formatieren

tstening · 19. September 2005 09:46

Hallo zusammen,

ich möchte einen ganz bestimmten Menüpunkt meines einfachen Menüs anders formatieren, indem ich hinter dem Text eine Grafik anfüge. OptionSplit kommt wohl nicht in Frage, weil ich exakt bestimmen will, welcher Menüpunkt es sein soll. Bis jetzt nutze ich ein TMENU. Der Code sieht folgendermaßen aus:

temp.vnavigation = HMENU

# Define first level
temp.vnavigation.1 = TMENU
temp.vnavigation.1.NO = 1
temp.vnavigation.1.NO {
  allWrap = <img src="fileadmin/template/feitsch/pics/clear_7x10.gif" alt="" width="7" height="10" border="0" />|<br />
}
temp.vnavigation.1.ACT = 1
temp.vnavigation.1.ACT {
  allWrap = <img src="fileadmin/template/feitsch/pics/pfeil_grau.gif" alt="" width="7" height="10" border="0" />|<br />
}
temp.vnavigation.1.SPC = 1
temp.vnavigation.1.SPC {
  linkWrap = <div>|</div>
}

# Define second level
temp.vnavigation.2 = TMENU
temp.vnavigation.2.NO = 1
temp.vnavigation.2.NO {
  allWrap = <img src="fileadmin/template/feitsch/pics/clear_7x10.gif" alt="" width="7" height="10" border="0" /><span class="submenu">|</span><br />
}
temp.vnavigation.2.ACT = 1
temp.vnavigation.2.ACT {
  allWrap = <img src="fileadmin/template/feitsch/pics/pfeil_orange.gif" alt="" width="7" height="10" border="0" /><span class="submenu">|</span><br />
}

temp.vnavigation.3 = TMENU
temp.vnavigation.3.NO {
  allWrap = <img src="fileadmin/template/feitsch/pics/clear_7x10.gif" alt="" width="14" height="10" border="0" /><span class="submenu">|</span><br />
}
temp.vnavigation.3.ACT = 1
temp.vnavigation.3.ACT {
  allWrap = <img src="fileadmin/template/feitsch/pics/pfeil_gelb.gif" alt="" width="14" height="10" border="0" /><span class="submenu">|</span><br />
}

Idealerweise möchte ich in etwa so etwas machen können:

Wenn der Menüpunkt für die Seitenid xy gerendert wird, füge bitte hinter dem Menüpunkt die Datei neu.png an.

Ist das prinzipiell möglich? Wenn ja, wie macht man das bzw. wo finde ich dazu eine Dokumentation?

Viele Grüße,
Tobias

susanne427 · 16. Februar 2006 20:48

Hallo,
ich habe mich gerade durch alle (125) Seiten (FORUM -> TypoScript -> Menüs) gequält und circa 5 Einträge zu dem Thema gefunden. Eigentlich waren es Fragen, die nie beantwortet worden sind.

Nun gut, ich stehe vor dem selben Dilemma, und wollte einfach mal nachfragen, ob sich eine Lösung gefunden hat. Das würde mir sehr weiterhelfen.

Viele Grüße

Susanne

thomasweb · 21. März 2006 02:33

Ja komisch, irgendwie äussert sich niemand zu diesem Problem...

Anscheinend geht es nicht, aber das könnte ja jemand sagen oder??

#paralyzed#

Dalerion · 21. März 2006 08:04

Hmm... Ihr habt aber auch echt schwierige Probleme! :-)

Soll es sich denn dabei immer um den gleichen Menüpunkt handeln?

Ich würde dieses Problem folgendermaßen lösen: Jedem Menüpunkt eine ID, oder eine CSS-Klasse mitgeben. Gut bei einem TMENU mit before. und after. zu lösen. Und danach in der bestimmten Klasse in CSS das Bild einfügen.

Gruß Dale

jenses · 21. März 2006 09:44

Das Forum ist voll mit tausenden solcher Fragen, und die Lösung ist auch immer wieder gleich: conditions.
Wenn ihr ernsthaft mit TYPO3 arbeiten wollt, setzt euch auf den Hintern und studiert die TSref, anders wird dat nix :
https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/Index.html

[globalVar = TSFE:id = ID_der_Seite_mit_Sonderbehandlung]
temp.vnavigation.1.NO.allWrap = blablabla
[global]

Dalerion · 21. März 2006 09:57

Hmm... Aber diese Condition fragt doch nur ab, ob di aktuelle Seite die mit der ID blabla ist. Und nicht, ob es sich dabei um den Menüpunkt X handelt, oder hab ich die Condition jetzt nicht richtig verstanden?

Also ich stehe zwar nicht vor diesem Menüproblem, aber die Sache mit der Condition interessiert mich trotzdem! 🙂

Gruß Dale

thomasweb · 31. März 2006 12:13

@ Dale: Was meinst Du mit

Jedem Menüpunkt eine ID, oder eine CSS-Klasse mitgeben.

Genau das ist ja der Knackpunkt... wo kann ich denn bei einem Menü wie dem hier:

...
MENUE.entryLevel = 0
MENUE.special = directory
MENUE.special.value = 115
MENUE.1 = TMENU
MENUE.1.expAll = 1
MENUE.1.NO = 1 
MENUE.1.NO.beforeImg = fileadmin/teampoint/bilder/point.gif

MENUE.1.CUR = 1
MENUE.1.CUR.doNotLinkIt = 1
MENUE.1.CUR.beforeImg = fileadmin/teampoint/bilder/pfeilchen.gif
MENUE.1.CUR.allWrap = |<br /> 
MENUE.1.CUR.linkWrap = <b>  | </b>

MENUE.1.NO.RO = 1
MENUE.1.NO.beforeROImg = fileadmin/teampoint/bilder/Abstandhalter.gif

MENUE.1.NO.linkWrap =   |
MENUE.1.NO.allWrap = |<br /> 

MENUE.1.NO.ATagParams=class="navi"
...

Jeden EINZELNEN Menüpunkt ansteuern? Die werden doch komplett dynamisch in abhängigkeit von den vorhandenen Seiten erzeugt??!

thomasweb · 31. März 2006 12:35

@ jenses:

Ich hab folgendes in Zeile 9 von obigem Typoscript hinzugefügt:

[globalVar = TSFE:id = 117]
MENUE.1.NO.allWrap = text | 
[global]

Jetzt fügt er das Wort "text" vor JEDEN Link und beachtet andere anweisungen wie "MENUE.1.NO.allWrap = |<br /> " nicht mehr...

Eigentlich sollte er das Wort "text" nur vor den Link mit der Seiten ID 117 machen!?

Dalerion · 31. März 2006 12:39

Das Menü müßte natürlich etwas verändert werden. Beispielsweise mit before und after. Damit lassen sich die Menüpunkte erzeugen und z.B. jedem Link vorher noch eine CSS-Klasse geben.

mit before.cObject usw. Genau wie ich es schon geschrieben habe. So kann ich jedem Link eine Klasse geben, z.B.

 NO {
         allWrap =| &#124;&nbsp;
         doNotLinkIt = 1
         before.cObject = TEXT
         before.cObject.field = title
         before.cObject.dataWrap = <a href="{$domain}#|" title="Springe zur Branche&nbsp;&quot; 
         after.cObject = TEXT
         after.cObject.field = title
         after.cObject.dataWrap = &quot;" class="nobr"> | </a>&nbsp;
      }
   }

Damit lassen sich zu jedem Menüpunkt auch Klassen vergeben.

Gruß Dale

lulu · 31. März 2006 22:58

Hallo,

ich möchte "auch" jedem Menüpunkt in meiner Obernavigation (GMENU) je nach id/titel eine andere Klasse gegeben.

Trotz Forum und stundenlanges googeln und typo3 referenzen werd ich einfach nicht schlau. #angry#
das ist jetzt schon der dritte Tag und daher melde ich mich hier und hoffe, dass jemand das schon mal gemacht hat und sich erbarmt und einen kleinen beispielcode hat, der auch mit GMENUS funktioniert.

Im Prinzip müsste ich ja einfach nur den pagetitel oder die id in meinen wrap einbauen können, aber sämtliche versuche, auch über coditions und auch über freestyle à la $title usw - man merke die verzweiflung.. 😉
haben nicht funktioniert.

ich habe auch die beispiele hier im forum und andere im netz probiert, aber es geht einfach nicht, manchmal sind es auch fundamentale sachen, das zb die tags nur mit diesem oder jenem funktionieren..
ist ein GMENU so was aussergewöhnliches?

ich wäre dankbar

thomasweb · 6. April 2006 01:04

Hallo Dalerion,

aber das löst doch das Problem mit dem BESTIMMTEN Link nicht. Was Du schreibst macht er für alle Links.

ich will doch, dass er das NUR beim Link zur Seite id = 117 macht.

Ich dachte durch die Befehle...

[globalVar = TSFE:id = 117]
MENUE.1.NO.allWrap = text |
[global]

...könnte ich ihm sagen er soll das NUR für diesen einen Link zur Seite 117 machen.

jenses hat das ja so beschrieben. Leider weiss ich nicht, ob ich das Script richtig eingebaut habe. Deshalb nochmal mein komplettes Menü-Script:

### Menue
seite.10.marks {




MENUE = HMENU

# Menue ab welcher Ebene? Hier ab root, =0:
MENUE.entryLevel = 0


MENUE.special = directory
MENUE.special.value = 115
MENUE.1 = TMENU
MENUE.1.expAll = 1
MENUE.1.NO = 1
# MENUE.1.NO.doNotLinkIt = 1 
MENUE.1.NO.beforeImg = fileadmin/teampoint/bilder/point.gif




# !!! DER EINTRAG für eine bestimmte SEITE: (den er aber leider für JEDE Seite macht)


MENUE.1.NO {
[globalVar = TSFE:id = 117]
allWrap = testtext | 

[global] 
}








MENUE.1.CUR = 1
MENUE.1.CUR.doNotLinkIt = 1
MENUE.1.CUR.beforeImg = fileadmin/teampoint/bilder/pfeilchen.gif
MENUE.1.CUR.allWrap = |<br /> 
MENUE.1.CUR.linkWrap = <b>  | </b>

MENUE.1.NO.RO = 1
MENUE.1.NO.beforeROImg = fileadmin/teampoint/bilder/Abstandhalter.gif

MENUE.1.NO.linkWrap =   |
# allWrap=umschliesst jeden Menüeintrag
MENUE.1.NO.allWrap = |<br /> 

MENUE.1.NO.ATagParams=class="navi"
# MENUE.1.NO.ATagParams=style="color:red"
# auch möglich (ohne css-datei): ATagParams=style="color:red"


### Untermenü

MENUE.2 = TMENU
MENUE.2.NO = 1
MENUE.2.NO.allWrap =        |<br /> 
MENUE.2.NO.ATagParams=class="navi"

MENUE.2.CUR = 1
MENUE.2.CUR.doNotLinkIt = 1
# MENUE.2.CUR.beforeImg = fileadmin/teampoint/bilder/pfeilchen.gif
MENUE.2.CUR.allWrap = |<br /> 
MENUE.2.CUR.linkWrap =    <img src="fileadmin/teampoint/bilder/pfeilchen.gif" alt="" /> <b> | </b>


# Abstand (nichtlink) in Menue einfügen:
# MENUE.1.SPC = 1
# MENUE.1.SPC.doNotLinkIt = 1
MENUE.1.SPC.beforeImg = fileadmin/teampoint/bilder/point.gif
MENUE.1.SPC.allWrap = |<br /> 
MENUE.1.SPC.linkWrap =   | 


}

@ lulu:

mit GMENU kenn ich mich leider nicht aus. Ich hab das Problem ja noch nicht mal für TMENU gelöst 😢

theo · 6. April 2006 07:29

Auch hier gilt wieder die uralte und immergleiche Weisheit, daß Conditions nicht innerhalb geschweifter Klammern funktionieren.

Das sieht man übrigens auch am Codebeispiel von Jenses, der euch ja wirklich exakt vorgegeben hat, welchen Code ihr da einsetzen müßt.

impact · 12. April 2006 00:19

Der Code von Jenses ist ja auch einwandfrei. Bringt aber leider nur ein ungewünschtes Ergebnis. Die Links werden nämlich allesamt geändert, natürlich nur in dem Fall wenn man die mit TSFE:id angegebene Seite anzeigt, denn dann ist die Condition ja wahr.

Worum es glaube ich geht (und aktuell auch bei mir) ist, dass bestimmte Menüpunkte IMMER anders dargestellt werden. So möchte ich zb. dass der Menüeintrag in der 3. Ebene mit der UID: 1423 rot im Menü angezeigt wird. und zwar auch dann wenn er gerade nicht aktiv ist, aber dennoch sichtbar.

Die Condition TSFE:id bezieht sich ja nur auf die aktuelle Seite, aber nicht auf die Seite die gerade im Menü erzeugt wird, und genau da liegt das Problem.

Ich versuche gerade das ganze irgendwie mit ner CASE Abfrage hinzubekommen... aber auch das will nicht so ganz....

nach dem Motto::
CASE
key ...

wenn ID = XYZ dann setze fontColor (oder auch eben das BackgroundImage) so und so...
default = normale Anzeige so wie alle anderen...

impact · 12. April 2006 14:56

sorry... nur ein kleiner push für den thread, da mein letzter eintrag nicht gelistet wurde.

michelmichel · 23. April 2006 23:51

Hallo,

ich habe die Ideen in diesem Thread mal aufgegriffen und versucht, ein Menü aufzubauen, welches pro Level-1-Menüpunkt jeweils eine andere Grafik unterlegt. Dies habe ich versucht, mittels css zu erreichen.
Leider ist es mir nicht gelungen. :-( Das Ergebnis war leider:

<div class="item-1-normal">...</div>
<div class="item-1-active">...</div>
<div class="item-1-normal">...</div>
<div class="item-1-normal">...</div>
<div class="item-1-normal">...</div>

erwartet habe ich jedoch:

<div class="item-1-normal">...</div>
<div class="item-2-active">...</div>
<div class="item-3-normal">...</div>
<div class="item-4-normal">...</div>
<div class="item-5-normal">...</div>

(bei aktiviertem 2.Menüpunkt)
Hat jemand eine Idee, wie das richtig lauten muss?

temp.menue = HMENU
temp.menue.1 = TMENU
temp.menue.1 {
  expAll = 0
[globalVar = TSFE:id = 85]
  NO.allWrap = <div class="item-1-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-1-active"> | </div>
[global]
[globalVar = TSFE:id = 84]
  NO.allWrap = <div class="item-2-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-2-active"> | </div>
[global]
[globalVar = TSFE:id = 83]
  NO.allWrap = <div class="item-3-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-3-active"> | </div>
[global]
[globalVar = TSFE:id = 82]
  NO.allWrap = <div class="item-4-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-4-active"> | </div>
[global]
[globalVar = TSFE:id = 81]
  NO.allWrap = <div class="item-5-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-5-active"> | </div>
[global]
[globalVar = TSFE:id = 80]
  NO.allWrap = <div class="item-6-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-6-active"> | </div>
[global]
}

Danke & Gruß - Michael

theo · 24. April 2006 08:34

michelmichel schrieb
...versucht, ein Menü aufzubauen, welches pro Level-1-Menüpunkt jeweils eine andere Grafik unterlegt.

Das macht man mit optionsplit und nicht mit Conditions.

toyde · 24. April 2006 10:24

michelmichel schrieb

(bei aktiviertem 2.Menüpunkt)
Hat jemand eine Idee, wie das richtig lauten muss?

temp.menue = HMENU
temp.menue.1 = TMENU
temp.menue.1 {
  expAll = 0
[globalVar = TSFE:id = 85]
  NO.allWrap = <div class="item-1-normal"> | </div>
  ACT = 1
  ACT.allWrap = <div class="item-1-active"> | </div>
[global]
[globalVar = TSFE:id = 84]
..
..

1. Willkommen im Forum!
2. Ich könnte wetten, drei Posts über Dir hat theo beschrieben:

Auch hier gilt wieder die uralte und immergleiche Weisheit, daß Conditions nicht innerhalb geschweifter Klammern funktionieren.

3. optionSplit wie er erwähnt, ist in deinem Fall der Lösungsansatz. https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/Index.html such mal in der Doku danach.

michelmichel · 27. April 2006 22:59

Hallo!

Ich lese schon eine ganze Weile hier mit und habe bei den zahllosen Postings "nimm optionsplit" nie eine wirkliche Lösung als code gesehen. Deswegen will ich jetzt mal meine Lösung posten, damit andere Einsteiger in das Thema auch was davon haben.

DIV.id.WSMENU = 1
...
temp.menue = HMENU
temp.menue.1 = TMENU
temp.menue.1 {
  expAll = 0
  NO.allWrap = <div class="item-{elementUid}-normal"> | </div>||<div class="item-{elementUid}-normal"> | </div>||<div class="item-{elementUid}-normal"> | </div>||<div class="item-{elementUid}-normal"> | </div>||<div class="item-{elementUid}-normal"> | </div>||<div class="item-{elementUid}-normal"> | </div>
  NO.subst_elementUid = 1
  ACT = 1
  ACT.allWrap = <div class="item-{elementUid}-active"> | </div>||<div class="item-{elementUid}-active"> | </div>||<div class="item-{elementUid}-active"> | </div>||<div class="item-{elementUid}-active"> | </div>||<div class="item-{elementUid}-active"> | </div>||<div class="item-{elementUid}-active"> | </div>
  ACT.subst_elementUid = 1
}
...
  subparts.WSMENU < temp.menue

Der eigentliche clou mit optionsplit ist -und das geht in der Doku etwas unter-, dass t3 sich aus der ACT-Zeile den Punkt heraussucht, der gerade aktiv ist und sich für die restlichen nicht-aktiven Menüpunkte die entsprechend komplementären Elemente aus der NO-Zeile raussucht, so dass dann wirklich so was rauskommt, wie's ursprünglich angedacht war.

Ok, das elementUid hätte nicht unbedingt sein müssen, aber lasst mich doch damit rumschmachten. ;-)
Gruß - Michael

thomasweb · 3. Mai 2006 03:21

Hallo Michael,

kannst Du mal das ganze Skript fürs Menü reinstellen?

Dankeschön! 😃

theo · 3. Mai 2006 07:52

@michelmichel:
Ich glaube, Du hast Dich da ein bißchen verlaufen... 😉

Sorry, aber Deine optionsplit-wraps sind beide absolut und komplett sinnfrei...
Und zwar sowohl syntaktisch, als auch inhaltlich.

michelmichel schrieb
Ok, das elementUid hätte nicht unbedingt sein müssen, aber lasst mich doch damit rumschmachten. ;-)

Ganz im (definitiven) Gegenteil... 😉

Ausschließlich dadurch erhältst Du Deine unterschiedlichen Klassen und durch rein gar nichts anderes.

Folgender völlig harmloser "normaler" Code macht exakt dasselbe:

DIV.id.WSMENU = 1
...
temp.menue = HMENU
temp.menue.1 = TMENU
temp.menue.1 {
  expAll = 0
  NO.allWrap = <div class="item-{elementUid}-normal"> | </div>
  NO.subst_elementUid = 1
  ACT = 1
  ACT.allWrap = <div class="item-{elementUid}-active"> | </div>
  ACT.subst_elementUid = 1
}
...
  subparts.WSMENU < temp.menue