【问题标题】:Create a Bootstrap menu with WayFinder使用 WayFinder 创建引导菜单
【发布时间】:2016-09-09 17:07:04
【问题描述】:

尝试使用 WayFinder 创建引导菜单。如何完成?

<ul class="nav navbar-nav">
   <li class="dropdown">
      <a href="#" class="dropdown-toggle" id="drop1" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Dropdown <span class="caret"></span> </a> 
      <ul class="dropdown-menu" aria-labelledby="drop1">
         <li><a href="#">Action</a></li>
         <li><a href="#">Another action</a></li>
         <li><a href="#">Something else here</a></li>
         <li role="separator" class="divider"></li>
         <li><a href="#">Separated link</a></li>
      </ul>
   </li>
   <li class="dropdown">
      <a href="#" class="dropdown-toggle" id="drop2" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Dropdown <span class="caret"></span> </a> 
      <ul class="dropdown-menu" aria-labelledby="drop2">
         <li><a href="#">Action</a></li>
         <li><a href="#">Another action</a></li>
         <li><a href="#">Something else here</a></li>
         <li role="separator" class="divider"></li>
         <li><a href="#">Separated link</a></li>
      </ul>
   </li>
</ul>

到目前为止我的 WayFinder 通话:

[[Wayfinder? &startId=`0` &level=`1`
                               &hideSubMenus=`TRUE` &includeDocs=`1,2,3,4,5,55,7,8,74`
                               &outerTpl=`chunk_navigation-menu`]]

我的 chunk_navigation-menu 看起来像这样: &lt;ul class="navbar-nav nav"&gt;[+wf.wrapper+]&lt;/ul&gt;

【问题讨论】:

    标签: modx modx-evolution wayfinder


    【解决方案1】:

    首先,我假设您使用的是 MODX Evolution。

    最简单的方法是使用

    &outerClass
    &parentClass
    &innerClass
    &parentRowTpl
    

    在您的 Wayfinder 通话中。

    应该是这样的:

    [[Wayfinder? &startId=`[(site_start)]` &level=`2` &outerClass=`nav navbar-nav` &parentClass=`dropdown` &innerClass=`dropdown-menu` &parentRowTpl=`navbar_parentRowTpl`]]
    

    注意:如果您在上下文中不使用 [(site_start)],请将其替换为菜单的父资源 ID。

    在这种情况下,您还必须创建navbar_parentRowTpl。该块应如下所示:

    <li[+wf.id+][+wf.classes+] class="dropdown" id="menu[+id+]">
    <a class="dropdown-toggle" data-toggle="dropdown" data-target="#menu[+id+]" href="[+wf.link+]" title="[+wf.title+]">
        [+wf.linktext+]
        <b class="caret"></b>
    </a>
    [+wf.wrapper+]</li>
    

    由于我已经很长时间没有使用 Evo,如果此代码有问题,请告诉我,我可以为您提供帮助。

    我用这个例子作为参考:https://gist.github.com/mkay/f0afc97ec1536932e0a3

    并使用此表转换为 Evo 语法:

    https://rtfm.modx.com/revolution/2.x/making-sites-with-modx/tag-syntax

    【讨论】:

    • 嗨,Daniel,是的 MODx EVO - 您的上述答案非常有效,谢谢。必须做一些调整,但没关系...再次感谢。
    猜你喜欢
    • 2021-02-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-06-11
    • 2021-08-02
    相关资源
    最近更新 更多