2015-12-26 5 views
1

Я создал меню в wordpress (сайт [http://andreadis.loginet.gr/][1]). Это меню автоматически создается, когда пользователь создает пункт меню из Wordpress. И здесь я смущен о том, как я могу заставить его открывать вертикальные ответы.Отзывчивое меню, созданное (php) wordpress

header.php является

<!-- header --> 
    <header> 
     <div class="overNavPanel"> 
     <div class="container"> 
      <div class="col-md-12"> 
       <div class="row overNavPanel"> 
        <div class="col-md-2 col-sm-6" id="logo"> 
         <img class="img-reponsive" src="/wp-content/uploads/2015/12/logo.png" alt="logo.png"> 
        </div> 
        <div class="col-md-4 col-md-offset-6 col-sm-6" id="top-right-contact">      
            <image class="img-reponsive" src="/wp-content/uploads/2015/12/contact.png" alt="call-icon.png"> 


        </div> <!--col-md-4 col-md-offset-7-->  
       </div><!--row--> 
      </div>    
     </div> <!--container--> 
     </div><!--overNavPanel--> 
     <nav id="myNavbar" class="navbar navbar-default" role="navigation"> 
      <!-- Brand and toggle get grouped for better mobile display --> 
        <div class="navbar-header"> 
         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> 
          <span class="sr-only">Toggle navigation</span> 
          <span class="icon-bar"></span> 
          <span class="icon-bar"></span> 
          <span class="icon-bar"></span> 
         </button>   
        </div> 
       <!-- Collect the nav links, forms, and other content for toggling --> 
     <div class="navDiv"> 
      <div class="container"> 
       <div class="col-md-12"> 
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
         <ul class="nav navbar-nav"> 
         <ul id="nav" class="nav nav-pills nav-justified"> 
          <li><?php wp_nav_menu(array('container_class'=>'nav','container'=>'container'));?></li> 

        </div> 
       </div> 
      </div> 
     </div> 
    </header> 
    <!-- /header --> 

ответ

1

вы можете использовать этот плагин для создания отзывчивого меню для вас responsive-menu

или вы можете проверить этот сайт navnav.co

есть много готовых реагирующих Navs выберите тот, который вам нравится, и применять его JS & CSS

2

Несколько выводов:

  1. Вы загружаете JavaScript-бутстрап дважды. Наверное, поэтому разрушение не работает. Убедитесь, что Bootstrap JS загружен только один раз.
  2. Структура HTML (не PHP) выше, не полностью соответствует примерам Bootstrap, поэтому вам может потребоваться изменить ее, чтобы она работала правильно. Вот моя сценарий для вашего дела: https://jsfiddle.net/masa671/bjv1ovbw/
  3. Часть, сгенерированная PHP: вызов для создания элемента списка не будет работать. Вам нужна реализация PHP, которая генерирует правильную структуру для Bootstrap. This one выглядит многообещающим, но я думаю, вы уже используете тему Bootstrap для Wordpress, которая также может иметь соответствующую реализацию? Какую тему вы используете?
Смежные вопросы