List menu

A HMENU of type special = list lets you create a menu that lists the pages you define in the property special.value.

Mount pages are supported.

Properties

Name Type
list of page IDs /stdWrap

special.value

special.value
Type
list of page IDs /stdWrap
Default
0

This will generate a menu with the two pages (uid=35 and uid=56) listed:

EXT:site_package/Configuration/TypoScript/setup.typoscript
lib.listOfSelectedPages = HMENU
lib.listOfSelectedPages {
    special = list
    special.value = 35, 56
    // render the menu
}
Copied!

If special.value is not set, the default uid is 0, so that only your homepage will be listed.

Example: Menu of all subpages

The content element Menu > Pages provided by the system extension fluid_styled_content is configured with a MenuProcessor which is based on the options of the HMENU and provides all its properties:

EXT:fluid_styled_content/Configuration/TypoScript/ContentElement/MenuPages.typoscript
# Menu of selected pages:
# ...
#
# CType: menu_pages

tt_content.menu_pages =< lib.contentElement
tt_content.menu_pages {
    templateName = MenuPages
    dataProcessing {
        10 = menu
        10 {
            special = list
            special.value.field = pages
            dataProcessing {
                10 = files
                10 {
                    references.fieldName = media
                }
            }
        }
    }
}
Copied!

The following Fluid template can be used to style the menu:

EXT:fluid_styled_content/Resources/Private/Templates/MenuPages.html
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
<f:layout name="Default" />
<f:section name="Main">
    <f:if condition="{menu}">
        <ul>
            <f:for each="{menu}" as="page">
                <li>
                    <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')}{f:if(condition: page.current, then: ' aria-current="page"')} title="{page.title}">
                        <span>{page.title}</span>
                    </a>
                </li>
            </f:for>
        </ul>
    </f:if>

</f:section>
</html>
Copied!