如何在WordPress中为我的引导程序主题的移动版本添加不同的菜单？

Question

我有桌面和平板电脑的主菜单,但我希望当用户进入移动视图时,该菜单中的链接会发生变化.不确定从哪里开始.这是我在header.php文件中为桌面版本的Bootstrap菜单所做的:

<div class="container">
<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
    <span class="sr-only">Toggle</span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
    <span class="icon-bar"></span>
  </button>
  <a class="navbar-brand" href="<?php bloginfo( 'url' ); ?>"<?php bloginfo( 'name' ); ?>><img src="<?php bloginfo('template_directory');?>/img/snaglogo.png" /></a>
</div>
<div class="collapse navbar-collapse">


<?php
    $args = array(
          'menu'         => 'header-menu',
          'menu_class'   =>'nav navbar-nav navbar-right',
          'container'    =>'false'
          );
            wp_nav_menu( $args );

 ?>

</div><!--/.nav-collapse -->

我是否会为手机添加另一件？不太确定.

Answer 1

我建议使用bootstrap类在导航栏上:

<div class="hidden-xs hidden-sm">

然后使用类创建一个单独的移动导航栏:

<div class="visible-xs visible-sm hidden-md hidden-lg">

这将允许您将链接设置为完全不同的链接,而不会以不利的方式影响导航栏.

以下是有关"隐藏"和"可见"类的更多信息:

http://getbootstrap.com/css/#responsive-utilities-classes