2016-07-03 2 views
1

Я пытаюсь преобразовать сайт начальной загрузки в Wordpress, и моя текущая проблема связана с навигационной панелью. Я создал все свои файлы для wordpress, создал меню и фактически вижу. Проблема в том, что на маленьких экранах меню не рушится. Ниже мой код для header.php:Как преобразовать загрузочный navbar в wordpress

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<meta name="description" content=""> 
<meta name="author" content=""> 
<link rel="icon" href="../../favicon.ico"> 
<title><?php bloginfo('name') ?></title> 
    <link href="css/ie10-viewport-bug-workaround.css" rel="stylesheet"> 
    <!-- Custom styles for this template --> 
    <link href="<?php bloginfo('stylesheet_url') ?>" rel="stylesheet"> 
    <script src="js/ie-emulation-modes-warning.js"></script>  
    <?php wp_head(); ?> 
    </head> 
    <body> 
    <nav class="navbar navbar-inverse"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">Project name</a> 
    </div> 
    <div id="navbar" class="navbar-collapse collapse"> 
     <?php 
     wp_nav_menu(array(
      'menu'    => 'primary', 
      'theme_location' => 'primary', 
      'depth'    => 2, 
      'container'   => 'div', 
      'container_class' => 'collapse navbar-collapse', 
    'container_id'  => 'bs-example-navbar-collapse-1', 
      'menu_class'  => 'nav navbar-nav navbar-right', 
      'fallback_cb'  => 'wp_bootstrap_navwalker::fallback', 
      'walker'   => new wp_bootstrap_navwalker()) 
     ); 
     ?> 
    </div><!--/.navbar-collapse --> 
    </div> 
</nav> 

Вслед за index.php:

<?php get_header(); ?> 
<?php get_footer(); ?> 

functions.php,:

<?php 
    require_once('wp_bootstrap_navwalker.php'); 
    register_nav_menus(array(
'primary' => __('Primary Menu', 'Experiment Website'), 
)); 
?> 

И, наконец, сноска:

<script  src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script> 
<script src="<?php echo get_template_directory_uri(); ?>/js/bootstrap.min.js"></script> 
<script src="js/ie10-viewport-bug-workaround.js"></script> 
<?php wp_footer(); ?> 

Как я могу свернуть меню на маленьких экранах?

ответ

1

Вы уже обернута вашу navwalker с navbar-collapse collapse так деление с удалить эту строку из кода navwalker ->container_class => collapse navbar-collapse,

+0

Большое спасибо за помощь. он работал отлично, и я определенно узнал больше. –

+0

Рад, что я помогу Элтону. Пометить это как правильный ответ, если он исправляет проблему. Приветственный человек –

Смежные вопросы