webman webman - 4 months ago 44
CSS Question

typo3 Content element special menu add class="active"

In typo3 one can select to insert a special menu as a content element, that is a specific collection of pages to which you wish to link.

In the menu I selected there is no class assigned if the menu item is the active one, I'd like to highlight it with css.


the answer:

1) copy the original fluid template: (menu of subpages of selected pages)




2) add a variable that gives current page id in your setup (libs.ts)

lib.pageId = TEXT
lib.pageId.data = page:uid

3) edit the template (I just give the applicable condition here)

<f:if condition="{page.uid} == {f:cObject(typoscriptObjectPath: 'lib.pageId')}">

4) include the new fluid template (I overwrite the original one, keeping the original name)

lib.fluidContent.partialRootPaths.1920 = EXT:myextension/Resources/Private/Partials/Menu/

or as i did, include it in your page-setup

page = PAGE
page {
    # Page Main template
    10 {
        partialRootPaths = EXT:myextension/Resources/Private/Partials/Menu/

5) if you'd like to add it as an option to the list you re-number the file (like Type-9.html) and add it to the menu in Page TSConfig:

TCEFORM.tt_content.menu_type {
   types {
         addItems {
            9 = menu of subpages of selected pages active highlighted