Typo3 - Baukasten: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
Zeile 58: Zeile 58:
 
}
 
}
 
</pre>
 
</pre>
 +
=== Menü mit 2 Ebenen als separate Listen ===
 +
Dieses Menü ist besonders für horizontale Navigationen geeignet. Da die 2. Ebene relativ angegeben wird muß man bei mehreren Navigationsbäumen aufpassen, daß evt. ein Untermenü einer anderen Navigation (anderer Baum) ebenfalls angezeigt wird. Das läßt sich z.B. umgehen in dem man das Navitemplate erst im Unterbaum setzt oder indem man im Hauptbaum eine Bedingung setzt ([PIDinRootline = 123])
 +
 +
Ebene 1 ist im Prinzip eine einfache Liste:
 +
'''Constants'''
 +
<pre>
 +
# Navi nur Level1
 +
#Startpunkt
 +
navi_startID = 1
 +
 +
#Trennzeichen für horizontale Navi:
 +
naviL1-delimiter = &nbsp;&nbsp;&#124;&nbsp;&nbsp;
 +
</pre>
 +
'''Setup'''
 +
<pre>
 +
### Top Navigation ###
 +
temp.naviL1 = HMENU
 +
temp.naviL1 {
 +
  #stdWrap.case = lower
 +
  special = directory
 +
  # Seitenid für den Einstieg
 +
  special.value = {$navi_startID}
 +
  1 = TMENU
 +
  1.noBlur = 1
 +
  1.wrap = <ul>|</ul>
 +
  1.NO = 1
 +
  1.NO.linkWrap = |*| <li>|{$naviL1-delimiter}</li> |*| <li>|</li>
 +
  1.ACT = 1
 +
  1.ACT.linkWrap =  |*| <li class="on">|{$naviL1-delimiter}</li> |*| <li class="on">|</li>
 +
  #1.ACTIFSUB = 1
 +
  #1.ACTIFSUB.linkWrap = <li class="on">|</li>
 +
}
 +
 +
</pre>
 +
 +
Für Ebene 2 wird eine weitere Liste generiert wenn man sich in einem bestimmten Level befindet:
 +
'''Constants'''
 +
<pre>
 +
# Navigation nur ab Level x  als ul (Standard entry Level1=2.Level)
 +
 +
#Trennzeichen für horizontale Navi:
 +
naviLx-delimiter = &nbsp;&nbsp;&#124;&nbsp;&nbsp;
 +
naviLx-entryLevel = 1
 +
</pre>
 +
 +
'''Setup'''
 +
<pre>
 +
temp.naviLx = HMENU
 +
temp.naviLx {
 +
  # Seitenbaumebene ab Level 1 darstellen (2. Ebene)
 +
  entryLevel = {$naviLx-entryLevel}
 +
# Level 2
 +
  1 = TMENU
 +
  1{
 +
      noBlur = 1
 +
      wrap = <ul>|</ul>
 +
      NO = 1
 +
  # Für horizontale Navi mit delimiter bei vertikal einfach nichts setzen
 +
      NO.linkWrap = |*| <li>|{$naviLx-delimiter}</li> |*| <li>|</li>
 +
 +
      ACT = 1
 +
  # Für vertikale Navi ohne delimiter...     
 +
      #ACT.linkWrap = <li class="on">|</li>
 +
  # und horizontal mit delimiter
 +
      ACT.linkWrap =  |*| <li class="on">|{$naviLx-delimiter}</li> |*| <li class="on">|</li>   
 +
 +
      #ACTIFSUB = 1
 +
      #ACTIFSUB.linkWrap = <li class="on">|
 +
  }
 +
}
 +
</pre>
 +
  
 
=== Menü als CSS formatierte Liste (allgemein) ===
 
=== Menü als CSS formatierte Liste (allgemein) ===

Version vom 15. Februar 2007, 20:16 Uhr

Auf Daten zugreifen

Standardeinstellungen

Typo3 - Standardeinstellungen

Navigation

Einfaches Menü mit 1 Ebene (CSS)

siehe: Menue als CSS formatierte Liste

Menü mit 2 Ebenen als verschachtelte Liste

Dieses Menü ist besonders für vertikale Navigationen geeignet

Constants

# Einstieg Level 1
navi-L12-startID = 1
navi-L12-delimiter =   |  
navi-L12-delimiter =

Setup

### Top Navigation ###
temp.navi-L12 = HMENU
temp.navi-L12 {
  #stdWrap.case = lower
  special = directory
  # Seitenid für den Einstieg
  special.value = {$navi-L12-startID}
  # Ebene für den Einstieg (nicht vergessen wg. 2. Level)
  entryLevel = 1
  1 = TMENU
  1{
    noBlur = 1
    wrap = <ul>|</ul>
    NO = 1
    NO.linkWrap = |*| <li>|{$navi-L12-delimiter}</li> |*| <li>|</li>
    ACT = 1
    ACT.linkWrap =  |*| <li class="on">|{$navi-L12-delimiter}</li> |*| <li class="on">|</li>
    ACTIFSUB = 1
    #Wenn Unterpunkte dann li aufmachen
    ACTIFSUB.linkWrap = <li class="on">|
  }
  2 = TMENU
  2{
   noBlur = 1
   NO = 1
   #Unterpunkt also neue ul und danach li zu (von L1 geöffnet)
   wrap = <ul>|</ul></li>
   NO.linkWrap = |*| <li>|{$navi-L12-delimiter}</li> |*| <li>|</li>
   ACT = 1
   ACT.linkWrap =  |*| <li class="on">|{$navi-L12-delimiter}</li> |*| <li class="on">|</li>

  #ACTIFSUB = 1
  #ACTIFSUB.linkWrap = <li class="on">|</li>
  }
}

Menü mit 2 Ebenen als separate Listen

Dieses Menü ist besonders für horizontale Navigationen geeignet. Da die 2. Ebene relativ angegeben wird muß man bei mehreren Navigationsbäumen aufpassen, daß evt. ein Untermenü einer anderen Navigation (anderer Baum) ebenfalls angezeigt wird. Das läßt sich z.B. umgehen in dem man das Navitemplate erst im Unterbaum setzt oder indem man im Hauptbaum eine Bedingung setzt ([PIDinRootline = 123])

Ebene 1 ist im Prinzip eine einfache Liste: Constants

# Navi nur Level1
#Startpunkt
navi_startID = 1

#Trennzeichen für horizontale Navi:
naviL1-delimiter =   |  

Setup

### Top Navigation ###
temp.naviL1 = HMENU
temp.naviL1 {
  #stdWrap.case = lower
  special = directory
  # Seitenid für den Einstieg
  special.value = {$navi_startID}
  1 = TMENU
  1.noBlur = 1
  1.wrap = <ul>|</ul>
  1.NO = 1
  1.NO.linkWrap = |*| <li>|{$naviL1-delimiter}</li> |*| <li>|</li>
  1.ACT = 1
  1.ACT.linkWrap =  |*| <li class="on">|{$naviL1-delimiter}</li> |*| <li class="on">|</li>
  #1.ACTIFSUB = 1
  #1.ACTIFSUB.linkWrap = <li class="on">|</li>
}

Für Ebene 2 wird eine weitere Liste generiert wenn man sich in einem bestimmten Level befindet: Constants

# Navigation nur ab Level x  als ul (Standard entry Level1=2.Level)

#Trennzeichen für horizontale Navi:
naviLx-delimiter =   |  
naviLx-entryLevel = 1

Setup

temp.naviLx = HMENU
temp.naviLx {
  # Seitenbaumebene ab Level 1 darstellen (2. Ebene)
   entryLevel = {$naviLx-entryLevel}
# Level 2
   1 = TMENU
   1{
      noBlur = 1
      wrap = <ul>|</ul>
      NO = 1
   # Für horizontale Navi mit delimiter bei vertikal einfach nichts setzen
      NO.linkWrap = |*| <li>|{$naviLx-delimiter}</li> |*| <li>|</li>

      ACT = 1
   # Für vertikale Navi ohne delimiter...      
      #ACT.linkWrap = <li class="on">|</li>
   # und horizontal mit delimiter
      ACT.linkWrap =  |*| <li class="on">|{$naviLx-delimiter}</li> |*| <li class="on">|</li>    

      #ACTIFSUB = 1
      #ACTIFSUB.linkWrap = <li class="on">|
   }
}


Menü als CSS formatierte Liste (allgemein)

Menue als CSS formatierte Liste

CSS-Flyout Menü

Typo3 - CSS-Flyout Menü

News Modul

Hier gibt es fertige Konfigurationen: News (tt_news)