根据第一级，具有不同第二级的 Typoscript 菜单

Question

我正在尝试构建一个带有打字错误的菜单，其中第 2 级根据第 1 级菜单项的不同而不同 - 这是我迄今为止尝试过的方法，但它无法正常工作：

lib.mainnav = HMENU
lib.mainnav {

    wrap = <ul id="nv-main">|<li class="responav"><i class="fas fa-bars"></i></li></ul>

    1 = TMENU
    1 {
        expAll = 1
        NO = 1
        NO.wrapItemAndSub = <li>|</li>
        NO.stdWrap.htmlSpecialChars = 1

        CUR = 1
        CUR.wrapItemAndSub = <li class="current">|</li>
        CUR.stdWrap.htmlSpecialChars = 1
    }

    # von 1 (TMENU) kopieren
    2 < .1
    2 {
        expAll = 1
        wrap = <div class="nv-main-sub-bg"><div class="nv-main-sub-wrapper clearfix">|</div></div>
        wrap.override = <div class="nv-main-sub-bg"><div class="nv-main-sub-wrapper indented clearfix">|</div></div>
        wrap.override.if {
            value = 6
            equals.data = page:uid
        }

        stdWrap.cObject = COA
        stdWrap.cObject {

            20 = HMENU
            20 {
                special = directory
                special.value.data = field:pid

                1 = TMENU
                1 {
                    wrap = <div class="nv-main-col-sub"><ul>|</ul></div>

                    NO = 1
                    NO.allWrap = <li>|</li>
                    NO.stdWrap.htmlSpecialChars = 1
                    NO.after.cObject = COA
                    NO.after.cObject {

                        wrap = <div class="nv-main-info-wrapper"><div class="nv-main-col-info">|</div></div>

                        # Text aus dem Feld subtitle oder title der Seiteneigenschaften auslesen
                        10 = TEXT
                        10 {
                            value.field = subtitle // title
                            stdWrap.wrap = <p>|</p>
                        }

                        # Bild aus Reiter Resourcen der Seiteneigenschaften auslesen (nur bei Page-UID 4)
                        20 = FILES
                        20 {
                            if.value.field = pid
                            if.equals = 4
                            references {
                                table = pages
                                # Seiten-ID
                                uid.dataWrap= {field:uid}
                                fieldName = media
                            }
                            renderObj = IMAGE
                            renderObj {
                                file.width = 290c
                                file.height = 200c
                                file.import.data = file:current:uid
                                file.crop.data = file:current:crop
                                file.treatIdAsReference = 1
                                altText.data = file:current:title
                                ##params = class="img-responsive"
                                wrap = |
                            }
                        }

                        # Text aus dem Feld "abstract" auslesen (nur bei Page-UID 6)
                        30 = TEXT
                        30 {
                            if.equals.field = pid
                            if.value = 6
                            value.field = abstract
                            stdWrap.wrap = <p class="b-sub">|</p>
                        }
                    }

                    CUR < .NO
                    CUR.allWrap = <li class="current">|</li>

                }

            }

        }

    }

}

这将创建一个 2 级菜单，其中第 2 级是菜单项的组合，每个菜单项都带有文本信息和图片已经可用。我想要的是一个不同的二级菜单，具体取决于所选的一级项目。为此，我需要更改包装并用其他文本替换图像。

你能给我一个提示吗？非常感谢您的帮助！

迈克尔

编辑： 打字错误 V.8.7.16

页面树：

Item  1
-- Subitem 1 **with text and picture**
-- Subitem 2 **with text and picture**
-- Subitem 3 **with text and picture**
-- ...
-- Subitem XX **with text and picture**
Item 2
-- Subitem 1 **with text and picture**
-- Subitem 2 **with text and picture**
-- Subitem 3 **with text and picture**
-- ...
-- Subitem XX **with text and picture**
Item 3
-- Subitem 1 **only with text** (headline and copytext)
-- Subitem 2 **only with text** (headline and copytext)
-- Subitem 3 **only with text** (headline and copytext)
-- ...
-- Subitem XX **only with text** (headline and copytext)
Item 4
-- Subitem 1 ...
-- ...
Item 5
-- Subitem 1 ...
-- ...

HTML-结构：

<ul id="nv-main">

    <li>
        <a href="">Item 1</a>

        <div class="nv-main-sub-bg">

            <div class="nv-main-sub-wrapper clearfix">

                <div class="nv-main-col-sub">

                    <ul>
                        <li>
                            <a href="">Subitem 1 ** with text and picture **</a>

                            <div class="nv-main-info-wrapper">

                                <div class="nv-main-col-info">
                                    <p>XXX</p> <!— from title/subtitle —>
                                    <img src=„XXX“ border="0"> <!— from Resources —>
                                </div>

                            </div>

                        </li>

                        <li> … </li>
                        <li> … </li>
                        <li> … </li>
                        …

                    </ul>

                </div>

            </div>

        </div>

    </li>

    <li> … </li>

    <li>
        <a href="">Item 3</a>

        <div class="nv-main-sub-bg">

            <div class="nv-main-sub-wrapper **indented** clearfix">

                <div class="nv-main-col-sub">
                    <ul>
                        <li>
                            <a href="">Subitem 1 ** only with text **</a>

                            <div class="nv-main-info-wrapper">

                                <div class="nv-main-col-info">
                                    <p class="b-head">XXX</p> <!— from title/subtitle —>
                                    <p class="b-sub">XXX</p> <!— from abstract —>
                                </div>

                            </div>

                        </li>

                        <li> … </li>
                        <li> … </li>
                        <li> … </li>
                        …
                    </ul>

                </div>

            </div>

        </div>

    </li>

    <li> … </li>
    <li> … </li>

</ul>

Answer 1

我最近遇到了类似的问题。

二级和三级导航必须根据一级选择的项目。

是否需要将第二个嵌套到活动项目中？

<ul class="first-level">  
    <li>item 1</li>
    <li>item 2
        <ul class="second-level">  
            <li>item 3</li>
    </li>
</ul>

或者你能处理这样的结构吗？

<ul class="first-level">  
    <li>item 1</li>
    <li>item 2</li>
</ul>
<ul class="second-level">  
    <li>item 3</li>
</ul>

Answer 2

通常在菜单中处理 "position" 是选项拆分的工作，但这需要完全重写第二级，因为它必须放在菜单的 "after" 部分第一级项目。

但是由于子菜单的行为实际上是由它所属的父页面决定的，而不仅仅是这个父页面在菜单第一级中的位置，你应该选择一个特定的 PID 值位置。

您可以为此目的使用 "if" 或 "cObject" CASE，以便可以根据其项目的 pid 值更改第二级。

Answer 3

一个解决方案是呈现第二层的所有信息，并由 CSS 决定显示哪些部分（取决于 [=31] 在第一层设置的匹配 class =]一级页面）

另一种方法是（正如 Joey 提到的）：根据当前页面的 pid 构建您的 .after 对象。要么你有一个页面列表，其中有特殊呈现 'only with text' 或（更复杂）你使用 pid 访问一级页面的属性表示这种特殊呈现。

包含第 uid 页列表的简单解决方案可能是：

2.after.cObject = CASE
2.after.cObject {
    key.field = pid

    default = COA
    default {
        // rendering of **with text and picture**
    }

    // uid of level1 page 
    123 = COA
    123 {
        // rendering of **only with text**
    }
    // alternative level1 page with this rendering:
    234 < .123
}

如果您的选项 **only with text** 与 **with text and picture** 相同，只是没有图片，您可以修改现有代码（使用 HMENU 和 special=directory 似乎非常复杂) 空白图片:

NO.after.cObject.20.if {
    isInList.field = pid
    // store pages uids in constant like: 1,2,34,50,87
    value = {$specialPagesUidsList}  
    negate = 1
}

根据第一级，具有不同第二级的 Typoscript 菜单

Typoscript Menu with different 2nd level depending on 1st level

typo3

typoscript

typo3-8.x