This is sort of a long snippet, but anyway it is an example of making a vertical 3 level menu, which expand and collapse according to the active and current chosen list-item / page. The menu made as nested unordered list, and further it is wrapped in a box made of divs, where the title of active parent page to the menu is shown. The pattern of the typoscript menu could be repeated, if a fourth level is wanted, and it could be shortened to a 1 or 2 level menu.
## SubMenu [Begin]
# Removes the menubox from the page ids: 19, 23 (if the page does not have subpages, you don't want an empty box)
[PIDinRootline = 19,23]
# do nothing (PIDupinRootline doesn't seem to work?)
[else]
boxtop = TEXT
# get the title of the page on the first level of the rootline.
boxtop.data = leveltitle:1
boxtop.wrap =
boxbottom.value =
[end]
lib.subMenu = COA
lib.subMenu {
# include top of columnbox
9 < boxtop
# making the menu
10 = HMENU
# defines the menu entrylevel
10.entryLevel = 1
10.1 = TMENU
10.1 {
noBlur = 1
CUR = 1
IFSUB= 1
ACTIFSUB = 1
}
# Formatting of menu normal entries as list items.
10.1.NO {
wrapItemAndSub =
}
# Current menu item is unlinked and wrapped in span
10.1.CUR {
wrapItemAndSub =
doNotLinkIt = 1
allWrap = |
}
# If the menu item has subs add class plus to change icon to it has subs
10.1.IFSUB {
wrapItemAndSub =
}
# Active items above current to be formatted differently
10.1.ACTIFSUB {
wrapItemAndSub =
}
# Wrap the first level of the menu inside an unordered list
10.1.wrap =
10.2 = TMENU
10.2 {
noBlur = 1
CUR = 1
IFSUB= 1
ACTIFSUB = 1
}
# Same formatting of menu entries as list items.
10.2.NO {
wrapItemAndSub =
ATagParams =
}
# Current menu item is unlinked and marked too
10.2.CUR {
wrapItemAndSub =
doNotLinkIt = 1
allWrap = |
}
# If the menu item has subs add class plus to change icon
10.2.IFSUB {
wrapItemAndSub =
}
# Active items above current to be formatted differently as for first level
10.2.ACTIFSUB {
wrapItemAndSub =
}
# Wrap the second level of the menu inside an unordered list
10.2.wrap =
10.3 = TMENU
10.3 {
noBlur = 1
CUR = 1
IFSUB = 1
ACTIFSUB = 1
}
# Same formatting of menu entries as list items.
10.3.NO {
wrapItemAndSub =
ATagParams =
}
# Current menu item is unlinked and marked too
10.3.CUR {
wrapItemAndSub =
doNotLinkIt = 1
allWrap = |
}
# If the menu item has subs add class plus to change icon
10.3.IFSUB {
wrapItemAndSub =
}
# Active items above current to be formatted differently as for higher levels
10.3.ACTIFSUB {
wrapItemAndSub =
}
# Wrap the third level of the menu inside an unordered list
10.3.wrap =
# end of columnbox
11 < boxbottom
}
## SubMenu [End]
4 Responses to TYPO3: XHTML Valid 3 Level Menu in Typoscript