Horizontales Menü, 2 oder 3 Ebenen UNTEREINANDER

Hallo,

ich bringe mir derzeit mit Hilfe des Buches "Praxiswissen Typo3" von Peter Meyer Typo3 4.2 um.

Jetzt hänge ich allerdings und werde auch durch Googlen nicht fündig. Und zwar hätte ich gerne ein horizontales TMENU, bei dem die 2. und ggf. 3. Ebene (ob ich wirklich 3 brauche weiß ich noch nicht genau, sollte aber ja kein Problem sein eines aus 2 Ebenen auf 3 auszubauen) nicht verschachtelt in der 1.Ebene stehen, sondern darunter.

Es soll also so aussehen, wenn ich auf einen Menüpunkt (z.B. News) in der 1.Ebene klicke:

Home | News | Der Verein
Archiv | Kommentare

Ebene 1 und Ebene 2 sollen jeweils in ein <ol></ol> eingeschlossen sein.

Was ich bisher durch Googlen gefunden habe war dies:

Home | News | Archiv | Kommentar | Der Verein

Kann mir da bitte jemand helfen, wie ich das hinbekommen kann?

Vielen Dank und viele Grüße,

Hansi

Entweder verwendest du 2 unterschiedliche Marker in deinem HTML-Template, oder positionierst das Untermenü jeweils so wie du es benötigst per CSS. Das du das kannst muss ich voraussetzen, da du ja keine weiteren angaben machst.

Da du uns auch nicht sagst wo es dabei genau harkt, kann ich nur auf Beispiele und Referenzen verweisen, davon gibts nämlich allein hier im Forum ne Menge.

Also:
#65143

TSRef zum jeweils pasenden Object:
https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/ContentObjects/Hmenu/Index.html
und
https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/ContentObjects/Hmenu/Tmenu/Index.html#menu-objects

Außerdem:
http://www.typo3.net/typo3_dokumentation/

Falls du dennoch Probleme haben solltest, meld dich hier wieder mit einem Codebeispiel und einer Beschreibung wo es nicht weiter geht.

Hallo SLAng,

vielen Dank für deine Antwort!

SLAng schrieb

Entweder verwendest du 2 unterschiedliche Marker in deinem HTML-Template,

Das hatte ich anfangs vor, bis ich in dem Buch zum Punkt Menü gekommen bin, wo ich dann gelesen habe, dass die nur einen Marker verwenden in den Beispielen und auch nirgends fand, wie ich mit dem Untermenü den 2.Marker ansprechen kann.

SLAng schrieb

oder positionierst das Untermenü jeweils so wie du es benötigst per CSS.

Hmm, wie das gehen soll bei meinem Problem (bei mir werden ja die <ol>s verschachtelt... Meiner Meinung geht da mit CSS nichts, dass die 1.Ebene horizontal oben und die vertikale horizontal darunter erscheint.

SLAng schrieb

Das du das kannst muss ich voraussetzen, da du ja keine weiteren angaben machst.

Ich habe so viele Beispiele per Copy&Paste probiert, dass ich mal keinen Code gepostet, sondern auf einen Link zu einer Beschreibung, wie man so ein Menü macht, wie ich es gern hätte, gehofft habe.

SLAng schrieb

Falls du dennoch Probleme haben solltest, meld dich hier wieder mit einem Codebeispiel und einer Beschreibung wo es nicht weiter geht.

Danke! Ich poste hier mal einen der Codes, die ich probiert habe inkl. Screenshot, wie es dann aussieht und wie ich es gerne hätte (das habe ich ohne Typo3 als Vorabentwurf gemacht).

Hier, wie das Menü aussehen sollte (mit (X)HTML und CSS erstellt:
Bild: img406.imageshack.us/…/shouldbe.jpg

Wie es mit dem unteren Menü aussieht

(vor dem Klick)
Bild: img265.imageshack.us/…/menuvorklick.jpg

(nach dem Klick)
Bild: img264.imageshack.us/…/menunachklick.jpg

Hier mal der Quelltext des Menüs:

      MENU = HMENU
      MENU {
        special = directory
        special.value = 3
        
		# Erste Ebene
        1 = TMENU
        1.wrap = <ol class="menu">|</ol>
        1 {
    	  # no state: normale Formatierung
          NO {
            wrapItemAndSub = <li>|</li>
          }
          # act state: gültig von der Menü- bis zur aktuellen Seite
          ACT = 3
          ACT {
            wrapItemAndSub = <li class="">|</li>
          }
          # cur state: gültig für die aktuelle Seite
          CUR = 3
          CUR {
            wrapItemAndSub = <li class="menu-level1-current-active">|</li>
         }
     	 # ifsub state: gültig für seiten die unterseiten haben
         IFSUB=1
         IFSUB {
           wrapItemAndSub = <li class="menu-level1-with-subpage">|</li>
         }
       }
  	   
	   # Zweite Ebene
       2 = TMENU
       2.wrap = <ol class="submenu">|</ol>
       2 {
         NO {
           wrapItemAndSub = <li>|</li>
         }
         ACT = 3
         ACT {
           wrapItemAndSub = <li class="menu-level2-active">|</li>
         }
         CUR = 3
         CUR {
           wrapItemAndSub = <li class="menu-level2-current-active">|</li>
         }
         IFSUB = 3
         IFSUB {
           wrapItemAndSub = <li class="menu-level2-with-subpage">|</li>
         }
       }

Der Marker auf meiner Seite heißt ###MENU###, darunter hatte ich anfangs ###SUBMENU### (würde ja dann über CSS untereinander dargestellt,..).

Kann man das dann, wenn man diese beiden Marker benutzt, so einrichten, dass ###SUBMENU### nicht als Text ausgegeben wird, wenn keine 2.Ebene vorhanden ist?

Reicht das als Angabe oder braucht ihr sonst noch Quelltext?

Vielen Dank und viele Grüße,

Dirk

Also der Marker wird ja nur dann angezeigt, wenn du den nicht richtig ansprichst und nicht wenn einfach nur die entsprechende Ebene leer ist. Grundsätzlich sollte man sich aber schon sicher sein das man ein Untermenü benötigt. Wenn nicht braucht man ja auch nicht den Marker setzen. Für die eventuelle dritte Ebene benötigst du dann keinen weiteren Marker.

So Sachen wie ACT = 3 gibts natürlich auch nicht. Entweder aktivieren oder nicht aktivieren. Also 1 oder 0.

Dann ist mir noch aufgefallen das du CUR und ACT gemeinsam verwendest. Das geht natürlich, ist aber schon verwirrend, wenn man einen zustand hat für die Seite auf der man sich gerade befindet (CUR) und in dem Baum der gerade aktiv ist (ACT). Aber das ist natürlich geschmackssache.

ALso, ein einfaches Beispiel für ein horizontales listmenü mit 2 Markern und x Unterebenen:

MENU = HMENU
MENU {
	entryLevel = 0
# Erste Ebene
	1 = TMENU
	1.expAll = 0
	1.wrap = <ol class="menu">|</ol>
	1 {
# no state: normale Formatierung
		NO {
			wrapItemAndSub = <li>|</li>
		}
# act state: gültig von der Menü- bis zur aktuellen Seite
		ACT = 1
		ACT {
			wrapItemAndSub = <li class="">|</li>
		}
# cur state: gültig für die aktuelle Seite
		CUR = 1
		CUR {
			wrapItemAndSub = <li class="menu-level1-current-active">|</li>
		}
# ifsub state: gültig für seiten die unterseiten haben
		IFSUB = 1
		IFSUB {
			wrapItemAndSub = <li class="menu-level1-with-subpage">|</li>
		}
	}
}

# Zweite Ebene

SUBMENU = HMENU
SUBMENU {
	entryLevel = 1
	1 = TMENU
	1.expAll = 0
	1.wrap = <ol class="submenu">|</ol>
	1 {
		NO {
			wrapItemAndSub = <li>|</li>
		}
		ACT = 1
		ACT {
			wrapItemAndSub = <li class="menu-level2-active">|</li>
		}
		CUR = 1
		CUR {
			wrapItemAndSub = <li class="menu-level2-current-active">|</li>
		}
		IFSUB = 1
		IFSUB {
			wrapItemAndSub = <li class="menu-level2-with-subpage">|</li>
		}
	}
	2 < .1
	3 < .1
	4 < .1
	5 < .1
}

Also ohne special = directory. Die einzelnen Marker starten bei dem jeweils angegebenen entryLevel. Die erste Ebene ist 0, alle weiteren werden einfach hochgezählt. Du musst also entryLevel gegebenenfalls bei dir ändern.

Hi SLAng,

vielen Dank! Das funktioniert ja super!

Habe es noch um die Sortierung der Menüpunkte (mache ich per Zahlenwerte in 10er Schritten, die ich im Subtitle angebe). Gibt es da eine empfehlenswertere Lösung?

Vielen Dank und Grüße,

Dirk