菜单与div内的ModX

Question

我试着做一个菜单'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>

Answer 1

如果您发布了您的代码，或者至少是您希望实现的HTML输出，这将是有帮助的。以下是一些Wayfinder入门示例的链接。

Wayfinder输出列表和列表项。您将使用块模板来控制输出、添加类、添加额外的HTML标记等。

Answer 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/