Меню с div внутри ModX

Я пытался создать меню с "div" внутри, как здесь - http://www.stylight.com/ используя Wayfinder, но не нашел пути. Должен ли я искать или что я должен использовать, чтобы это произошло?

Я пытаюсь добиться этого вывода HTML:

<div class="navbar-collapse collapse" id="navigation">

      <ul class="nav navbar-nav navbar-left">
   <li class="dropdown yamm-fw">
       <a href="#" class="dropdown-toggle" data-toggle="dropdown">Men<b class="caret"></b></a>
       <ul class="dropdown-menu">

    <li>
        <div class="yamm-content">
     <div class="row">
         <div class="col-sm-3">
      <img src="img/men.jpg" class="img-responsive hidden-xs" alt="">
         </div>
         <div class="col-sm-3">
      <h3>Clothing</h3>
      <ul>
          <li><a href="category.html">T-shirts</a></li>
          <li><a href="category.html">Shirts</a></li>
          <li><a href="category.html">Pants</a></li>
          <li><a href="category.html">Accessories</a></li>
      </ul>
         </div>
         <div class="col-sm-3">
      <h3>Clothing</h3>
      <ul>
          <li><a href="category.html">T-shirts</a></li>
          <li><a href="category.html">Shirts</a></li>
          <li><a href="category.html">Pants</a></li>
          <li><a href="category.html">Accessories</a></li>
      </ul>
         </div>
         <div class="col-sm-3">
      <h3>Shoes</h3>
      <ul>
          <li><a href="category.html">Trainers</a></li>
          <li><a href="category.html">Sandals</a></li>
          <li><a href="category.html">Hiking shoes</a></li>
          <li><a href="category.html">Casual</a></li>
      </ul>
         </div>
     </div>
        </div>
        <div class="footer clearfix hidden-xs">
     <h4 class="pull-right">Men</h4>
     <div class="buttons pull-left">
         <a href="#" class="btn btn-default"><i class="fa fa-tags"></i> Sales</a>
         <a href="#" class="btn btn-default"><i class="fa fa-star-o"></i> Favourites</a>
         <a href="#" class="btn btn-default"><i class="fa fa-globe"></i> Brands</a>
     </div>
        </div>

    </li>
       </ul>
   </li>
   
   <li class="dropdown yamm-fw open">
       <a href="#" class="dropdown-toggle" data-toggle="dropdown">Women <b class="caret"></b></a>
       <ul class="dropdown-menu" style="display: block;">

    <li>
        <div class="yamm-content">
     <div class="row">
         <div class="col-sm-3">
      <img src="img/women.jpg" class="img-responsive hidden-xs" alt="">
         </div>
         <div class="col-sm-3">
      <h3>Clothing</h3>
      <ul>
          <li><a href="category.html">T-shirts</a></li>
          <li><a href="category.html">Shirts</a></li>
          <li><a href="category.html">Pants</a></li>
          <li><a href="category.html">Accessories</a></li>
      </ul>
         </div>
         <div class="col-sm-3">
      <h3>Clothing</h3>
      <ul>
          <li><a href="category.html">T-shirts</a></li>
          <li><a href="category.html">Shirts</a></li>
          <li><a href="category.html">Pants</a></li>
          <li><a href="category.html">Accessories</a></li>
      </ul>
         </div>
         <div class="col-sm-3">
      <h3>Shoes</h3>
      <ul>
          <li><a href="category.html">Trainers</a></li>
          <li><a href="category.html">Sandals</a></li>
          <li><a href="category.html">Hiking shoes</a></li>
          <li><a href="category.html">Casual</a></li>
      </ul>
         </div>
     </div>
        </div>
        <div class="footer clearfix hidden-xs">
     <h4 class="pull-right">Women</h4>
     <div class="buttons pull-left">
         <a href="#" class="btn btn-default"><i class="fa fa-tags"></i> Sales</a>
         <a href="#" class="btn btn-default"><i class="fa fa-star-o"></i> Favourites</a>
         <a href="#" class="btn btn-default"><i class="fa fa-globe"></i> Brands</a>
     </div>
        </div>

    </li>
       </ul>
   </li>   
  </div>

2 ответа

Было бы полезно, если бы вы опубликовали свой код или, по крайней мере, вывод HTML, который вы надеетесь получить. Вот ссылка на некоторые вводные примеры Wayfinder .

Wayfinder выводит списки и элементы списка. Вы будете использовать шаблоны чанков для управления выводом, добавления классов, добавления дополнительных тегов HTML и т. Д.

У меня есть сайт с облачной темой, и я могу дать вам доступ к нашему обзору, но, по сути, к его 2 [[getResources]] вызовам

<li class="top-menu-item">
<a href="[[~[[+id]]]]" title="[[+pagetitle]]">[[+menutitle:default=`[[+pagetitle]]`]]</a>

      [[getResources? 
      &parents=`[[+id]]`
      &tpl=`nav-li-row-child-header_[[++theme]]` 
      &sortby=`menuindex` 
      &sortdir=`ASC` 
      &limit=`0` 
      &depth=`0`
      &toPlaceholder=`children`
      ]]
  [[+children:notempty=`<i class="fa fa-chevron-down js-mobile-drop"></i> <div class="child-sections"><div class="row-content">[[+children]]</div></div>`]]

http://modx-beetle.clients.modxcloud.com/

Другие вопросы по тегам