TYPO3 Typoscript Menü Snippets Überblick

### Typoscript Code ##########
lib.submenu_lache= COA
lib.submenu_lache{
  wrap = <div class="menu_left">|</div>
  10 = TEXT
  10{
    data = leveltitle : 1
    wrap = <div class="menu_left_top_tut">|</div>
  }
  15 = HMENU
  15{
    entryLevel = 1
    wrap = <div class="menu_left_menu" >|</div>
    1 = TMENU
    1{
      wrap = <ul id='menuList'>|</ul>
      noBlur =1
      ACT=1
      ACTIFSUB = 1
      NO{
        wrapItemAndSub = <li class='menuItem'>|</li>
        ATagParams = class='menuLink'
      } 
      ACT{
        wrapItemAndSub = <li class='menuItem'>|</li>
        ATagParams = class='menuLinkAct'
      }
      ACTIFSUB{
        wrapItemAndSub = <li class='menuItem'>|</li>
        ATagParams = class='menuLinkAct'
      }
    }
    2 = TMENU
    2{
      noBlur = 1
      ACT = 1
      ACTIFSUB = 1
      wrap = <ul class='submenuList'>|</ul>
      NO{
        wrapItemAndSub = <li class='submenuItem'>|</li>
        ATagParams = class='submenuLink'
      }
      ACT{
        wrapItemAndSub = <li class='submenuItem'>|</li>
        ATagParams = class='submenuLinkAct'
      }
      ACTIFSUB{
        wrapItemAndSub = <li class='submenuItem'>|</li>
        ATagParams = class='submenuLinkAct'
      }
    }
  }
}

/*-------------CSS---------------------*/
.menu_left{
  background-image: url(../../../../uploads/tx_tllbaseext/submenu_repeat.gif);
  background-repeat: repeat-y;
  font-size: 0.9em;
  color: #333333;
  margin-top:10px;
  margin-left:0px;
  width:146px;
  clear:both;
}
.menu_left_top, .menu_left_top_tut{
  font-size: 1em;
  font-weight: bold;
  color: #FFFFFF;
  height:17px;
  padding-left:4px;
  padding-top:2px;
}
.menu_left_top_tut{
  background-image: url(../../../../uploads/tx_tllbaseext/submenu_top_tut_2.gif);
  background-repeat: no-repeat;
        background-color: #64a419; 
}
.menu_left_bottom{
  background-image: url(../../../../uploads/tx_tllbaseext/submenu_bottom.gif);
  background-repeat: no-repeat; 
  height:5px;
  font-size:1px;
}
.menu_left_menu{

  padding-left:1px;
  padding-right:1px;
}
a.menu_left_link, a.menu_left_link_act{
    font-weight:normal;
    color:#333;
    text-decoration:none;
    font-size:0.9em;
}
a.menuLink, 
a.menuLink:link, 
a.menuLink:visited, 
a.menuLink:hover, 
a.menuLink:active,
a.menuLinkAct, 
a.menuLinkAct:link, 
a.menuLinkAct:visited{
  display:block;
  height:14px;
  margin:0px;
  padding:2px;
  font-size:1em;
  font-weight: normal;
  padding-left:4px;
  text-decoration:none;
  color:#333;
 
}
a.menuLink, a
.menuLink:link, 
a.menuLink:visited, 
a.menuLink:hover, 
a.menuLink:active{
       background-color:#fff;
}
a.menuLink:hover {
  background-color:#e1e1e1;
}

a.menuLinkAct, 
a.menuLinkAct:link, 
a.menuLinkAct:visited {
  background-color:#e1e1e1;
}
a.submenuLink, 
a.submenuLink:link, 
a.submenuLink:visited, 
a.submenuLink:hover, 
a.submenuLink:active,
a.submenuLinkAct, 
a.submenuLinkAct:link, 
a.submenuLinkAct:visited, 
a.submenuLinkAct:hover, 
a.submenuLinkAct:active{
  display:block;
  margin:0px;
  padding:1px;
  padding-left:30px;
  font-size:0.8em;
  font-weight: normal;
  text-decoration:none;
  background-image:url(../../../../uploads/tx_tllbaseext/schalter_subnavi.gif);
  background-repeat:no-repeat;
  background-position:top left;
}
a.submenuLink, 
a.submenuLink:link, 
a.submenuLink:visited, 
a.submenuLink:hover, 
a.submenuLink:active {
  color:#666666;
}
a.submenuLink:hover {
  text-decoration: underline;
}

a.submenuLinkAct, 
a.submenuLinkAct:link, 
a.submenuLinkAct:visited, 
a.submenuLinkAct:hover, 
a.submenuLinkAct:active {
  color:#99756d;
}
#tutorials a.submenuLinkAct, 
a.submenuLinkAct:link, 
a.submenuLinkAct:visited, 
a.submenuLinkAct:hover, 
a.submenuLinkAct:active {
color:#64a419;
}

#menuDiv {
  width:179px;
  margin:0px;
  padding:0px;
  padding-top:0px;
  padding-left:2px;
  text-align:left;
}
li.menuItem {
  list-style-type:none;
  text-align:left;
        border-bottom: 1px solid #ccc;
 
}
li.submenuItem {
  list-style-type:none;
  color:#666666;
  text-align:left;
  border-top:1px solid #fff;
  border-bottom: 1px solid #fff;
}
#menuList {
  margin:0px;
  padding:0px;
   
}
ul.submenuList {
  margin:0px;
  padding:0px;
     
}