Sie befinden sich hier

Inhalt

Zwei Wege zu Dropdown-Listen oder Pull-Down-Menüs

Immer wieder ist es sinnvoll auf Websites sogenannte Quicklinks einzusetzen. Diese dienen dazu den Besuchern schnelle Einstiegspunkte zu Funktionen oder Inhalten bereitzustellen.

Beispiel eines Dropdown-Menüs

In Typo3 bieten sich zwei generelle Möglichkeiten eine solches Dropdown-Menü zu erstellen. Entweder man erstellt das Menü mittels JSMENU, oder bastelt mit Hilfe eines TMENUs und weiterem HTML-Code die Liste selbst.

Dropdown-Listenmenü mit JSMENU

lib.dropdownmenu1 = HMENU
lib.dropdownmenu1 {
  special = directory
  ### PID der uergeordneten Seite
  special.value = 1
  wrap = |
  1 = JSMENU
  ### Target wohin die Links geöffnet werden
  1.target = _self
  ### Name des erstes Eintrags (nicht klickbar)
  1.firstLabelGeneral = Bitte wählen
}

Dropdown-Listenmenü mit einem TMENU

Dieses Menü erstellt ein Listenmenü aus zwei Ebenen der Seitenhierarchie 

lib.dropdownmenu2 = COA
lib.dropdownmenu2 {
  10 = HMENU
  10.special = directory
  ### PID der uergeordneten Seite
  10.special.value = 21
  ### hier beginnt der HTML-Code für das Dropdown
  10.wrap = <form name="quicklist-menu" action=""><select name="quicklist" onChange="window.location='index.php?id='+value" >|</select></form>
  ### hier beginnt das erste Level in der Seitenhierarchie
  10.1 = TMENU
  10.1 {
    expAll = 1
      ### Definition des Normal-Zustands
      NO {
        allWrap = <option value="{elementUid}">|</option>
        subst_elementUid = 1
        doNotLinkIt = 1
      }
      ### Definition fuer die aktuelle Seite
      CUR < .NO
      CUR = 1
      CUR.allWrap = <option value="{elementUid}" selected>|</option>
      }
  ### hier beginnt das zweite Level in der Seitenhierarchie
  10.2 = TMENU
  10.2 {
    expAll = 1
      NO {
        allWrap = <option value="{elementUid}">   -|</option>
        subst_elementUid = 1
        doNotLinkIt = 1
      }
      CUR < .NO
      CUR = 1
      CUR.allWrap = <option value="{elementUid}" selected>   -|</option>
  }
}

Kontextspalte