Zend Framework 2ナビゲーションメニューTwitter Bootstrapインテグレーション

Question

現在、データベースからメニューをビルドしており、コードは素晴らしいです。しかし、私は今、Twitterのブートストラップでメニューをスタイルしたいと思っています。これが私が問題を抱えている場所です。誰かがzendフレームワーク2のナビゲーションメニューをTwitterのブートストラップと統合する方法を知っていますか？興味のある人は、次のようなメニューが生成されます。

<ul class="nav"> 
<li> 
    <a href="/view-page/home">Home</a> 
    <ul> 
     <li> 
      <a href="/view-page/coupons">Coupons</a> 
      <ul> 
       <li> 
        <a href="/view-page/printable-coupons">Printable Coupons</a> 
        <ul> 
         <li> 
          <a href="/view-page/cut-these-coupons">Cut these here coupons</a> 
         </li> 
        </ul> 
       </li> 
      </ul> 
     </li> 
    </ul> 
</li> 
<li class="active"> 
    <a href="/view-page/about-us">About Us</a> 
</li> 
</ul> 

Answer 1

パーシャルを使用して、必要に応じてナビゲーションを生成できます。テンプレート内のあなたのナビゲーションを表示するには

：

アプリケーション/ナビゲーション/ topnav.phtml

<ul class="nav"> 
    <?php $count = 0 ?> 
    <?php foreach ($this->container as $page): ?> 
     <?php /* @var $page Zend\Navigation\Page\Mvc */ ?> 
     <?php // when using partials we need to manually check for ACL conditions ?> 
     <?php if(! $page->isVisible() || !$this->navigation()->accept($page)) continue; ?> 
     <?php $hasChildren = $page->hasPages() ?> 
     <?php if(! $hasChildren): ?> 
     <li <?php if($page->isActive()) echo 'class="active"'?>> 
      <a class="nav-header" href="<?php echo $page->getHref() ?>"> 
       <?php echo $this->translate($page->getLabel()) ?> 
      </a> 
     </li> 
     <?php else: ?> 
     <li class="dropdown"> 
      <a class="dropdown-toggle" data-toggle="dropdown" href="#"> 
       <span><?php echo $this->translate($page->getLabel()) ?></span> 
      </a> 

      <ul class="dropdown-menu" id="page_<?php echo $count ?>"> 
      <?php foreach($page->getPages() as $child): ?> 
       <?php // when using partials we need to manually check for ACL conditions ?> 
       <?php if(! $child->isVisible() || !$this->navigation()->accept($child)) continue; ?> 
       <li> 
        <a href="<?php echo $child->getHref() ?>"> 
         <?php echo $this->translate($child->getLabel()) ?> 
        </a> 
       </li> 
      <?php endforeach ?> 
      </ul> 
     </li> 
     <?php endif ?> 
     <?php $count++ ?> 
    <?php endforeach ?> 
</ul> 

明らかにそれは簡単です：

<?php $partial = array('application/navigation/topnav.phtml', 'default') ?> 
<?php $this->navigation('navigation')->menu()->setPartial($partial) ?> 
<?php echo $this->navigation('navigation')->menu()->render() ?> 

あなたのナビゲーションは、部分的にはこのようなものでなければなりません例では、ナビゲーションのレベルの任意の数の世話をしませんし、いくつかの余分なクラス名などを追加する必要がありますそれは動作するようにperfecブートストラップと一緒だが、あなたはそのアイデアを得る。

Answer 2

下記のコードを試してください。ブートストラップ3新しい、使用のために

<div class="nav-collapse"> 
     <?php 
      echo $this->navigation('navigation') 
      ->menu() 
      ->setMinDepth(0) 
      ->setMaxDepth(0) 
      ->setUlClass('nav') 
      ->setPartial(array('partial/topnav.phtml', 'Application')); 
     ?> 
    </div> 

Answer 3

：

<div class="navbar navbar-inverse navbar-fixed-bottom"> 
    <div class="navbar-inner"> 
    <div class="container"> 
     <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </a> 
     <ul class="nav" id="menu">  
     <?php $count = 0; ?> 
     <?php foreach ($this->container as $page): ?> 
      <?php //var_dump($page); exit;?> 
      <?php /* @var $page Zend\Navigation\Page\Mvc */ ?> 
      <?php // when using partials we need to manually check for ACL conditions ?> 
      <?php if(! $page->isVisible() || !$this->navigation()->accept($page)) continue; ?> 
      <?php $hasChildren = $page->hasPages() ?> 
      <?php if(! $hasChildren): ?> 
      <li> 
       <a class="nav-header" href="<?php echo $page->getHref() ?>"> 
        <?php echo $this->translate($page->getLabel()) ?> 
       </a> 
      </li> 
      <?php else: ?> 
       <a class="dropdown-toggle" data-toggle="dropdown" href="#page_<?php echo $count; ?>"> 
        <span><?php echo $this->translate($page->getLabel()) ?></span> 
       </a> 
       <ul class="dropdown-menu" id="page_<?php echo $count; ?>"> 
       <?php foreach($page->getPages() as $child): ?> 
        <?php // when using partials we need to manually check for ACL conditions ?> 
        <?php if(! $child->isVisible() || !$this->navigation()->accept($child)) continue; ?> 
        <li> 
         <a href="<?php echo $child->getHref() ?>"> 
          <?php echo $this->translate($child->getLabel()) ?> 
         </a> 
        </li> 
       <?php endforeach ?> 
       </ul> 
      <?php endif ?> 
      <?php $count++; ?> 
     <?php endforeach ?> 
     </ul> 
     <form class="navbar-search pull-right" action=""> 
      <input type="text" class="search-query span2" placeholder="Search"> 
     </form> 
     </div><!-- /.nav-collapse --> 
    </div><!-- /.container --> 
    </div><!-- /.navbar-inner --> 
</div><!-- /.navbar --> 

は、テンプレート内のあなたのナビゲーションを表示するには

アプリケーション/部分/ topnav.phtml： 部分あなたのナビゲーションはこのようなものでなければなりませんこれを部分図として示す。このため

<ul class="nav">

：この変更の外観を統合し、Zendのナビゲーションバーで感じることが

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
<div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="<?php echo $this->url('home') ?>"><img src="<?php echo $this->basePath('img/logo.png') ?>" alt="Title App"/>&nbsp;TitleText</a> 
    </div> 
    <div class="collapse navbar-collapse"> 
     <ul class="nav navbar-nav"> 
     <?php foreach ($this->container as $page) { ?> 
      <?php /* @var $page Zend\Navigation\Page\Mvc */ ?> 
      <?php // when using partials we need to manually check for ACL conditions ?> 
      <?php if (!$page->isVisible() || !$this->navigation()->accept($page)) { continue; } ?> 
      <?php $hasChildren = $page->hasPages(); ?> 
      <?php if (!$hasChildren) { ?> 
       <li> 
        <a href="<?php echo $page->getHref() ?>"> 
         <?php echo $this->translate($page->getLabel()) ?> 
        </a> 
       </li> 
      <?php } else { ?> 
      <li class="dropdown"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown"><?php echo $this->translate($page->getLabel()) ?> <b class="caret"></b></a> 
       <ul class="dropdown-menu"> 
        <?php foreach ($page->getPages() as $child) { ?> 
         <?php // when using partials we need to manually check for ACL conditions ?> 
         <?php if(!$child->isVisible() || !$this->navigation()->accept($child)) { continue; } ?> 
         <li> 
          <a href="<?php echo $child->getHref() ?>"> 
           <?php echo $this->translate($child->getLabel()) ?> 
          </a> 
         </li> 
        <?php } ?> 
       </ul> 
      </li> 
      <?php } ?> 
     <?php } ?> 
    </ul> 
    </div> 
</div> 
</nav> 

Answer 4

<ul class="nav navbar-nav">