0

我试着用 Wayfinder 制作一个里面有“div”的菜单——http: //www.stylight.com/,但没有找到方法。我应该看还是应该用什么来实现它?

我尝试实现这个 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>

4

2 回答 2

0

如果您发布您的代码,或者至少发布您希望实现的 HTML 输出,那将会很有帮助。这是一些 Wayfinder 介绍性示例的链接。

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

于 2015-07-08T03:28:16.920 回答
0

我有一个云主题网站,我可以让您访问我们的引导您完成它,但本质上是它的 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/

于 2015-07-10T23:57:21.583 回答