# left side submenu
lib.menu_sub = COA
lib.menu_sub {
  wrap = <div class="sub_menu">|</div>
  
  10 = HMENU
  10 {
    entryLevel = 1

    1 = TMENU
    1 {
      wrap = <ul>|</ul>

      NO {
        allWrap = <li>|</li>
        linkWrap = <span>|</span>
        ATagBeforeWrap = 1
      }

      CUR = 1
      CUR {
        wrapItemAndSub = <li class="active">|</li>
        linkWrap = <span>|</span>
        ATagBeforeWrap = 1
      }

      ACTIFSUB = 1
      ACTIFSUB {
        wrapItemAndSub = <li class="current">|</li>
        linkWrap = <span>|</span>
        ATagBeforeWrap = 1
      }
    }

    2 = TMENU
    2 {
      wrap = <ul>|</ul>
    
      NO {
        allWrap = <li>|</li>
        linkWrap = <span>|</span>
        ATagBeforeWrap = 1
      }
    
      ACT < .NO
      ACT = 1
      ACT {
        allWrap = <li class="active">|</li>
      }
    }

    3 < .2
  }
}

Assign special CSS classes for menu item in different states.

By default just <li>|</li>-wrap without class.

Active state - li-wrap and class="active"

If active and one of subitems is selected then for parent item li-wrap and class="current" and for child - li-wrap and class="active"

Different wrapping and css classes for different states of menu

navigation

TYPO3