我意识到这个问题已经在其他帖子中得到解决,但是,我遇到的问题是顶级导航链接无法在 this site上运行. 这是一个基于BootStrap 3构建的WordPress站点,使用NavWalker将WordPress导航集成到Bootstr
这是一个基于BootStrap 3构建的WordPress站点,使用NavWalker将WordPress导航集成到Bootstrap结构中.这是导航代码:
<div class="navbar navbar-default col-md-9" role="navigation"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <?php wp_nav_menu( array( 'menu' => 'Primary', 'theme_location' => 'Primary', 'depth' => 2, 'container' => 'div', 'container_class' => 'collapse navbar-collapse col-md-9', 'container_id' => 'none', 'menu_class' => 'nav navbar-nav', 'fallback_cb' => 'wp_bootstrap_navwalker::fallback', 'walker' => new wp_bootstrap_navwalker()) ); ?> </div><!-- /.container --> </div><!-- /.navbar -->
这本来就缺乏在下拉菜单上有好处的悬停功能.我用wpeden的以下解决方案解决了这个问题:
( function( $) { jQuery(function($) { $('.navbar .dropdown').hover(function() { $(this).find('.dropdown-menu').first().stop(true, true).delay(250).slideDown(); }, function() { $(this).find('.dropdown-menu').first().stop(true, true).delay(100).slideUp(); }); $('.navbar .dropdown > a').click(function(){ location.href = this.href; }); }); } )( jQuery );
这样可以很好地显示下拉导航,但父菜单项上没有活动链接.
我已经确认父母实际上有活动链接,将他们移出导航层次结构,没有孩子,他们正确显示链接,所以有些东西缺少,我无法识别,并会欣赏一两个敏锐的眼睛来帮助发现它.
NavWalker似乎是这样设计的.您需要在第85行的wp_bootstrap_navwalker.php中编辑源代码.让父母保留href,即使它有孩子
if ( $args->has_children && $depth === 0 ) { // $atts['href'] = '#'; // old line $atts['href'] = ! empty( $item->url ) ? $item->url : ''; // new line $atts['data-toggle'] = 'dropdown'; $atts['class'] = 'dropdown-toggle'; $atts['aria-haspopup'] = 'true'; } else { $atts['href'] = ! empty( $item->url ) ? $item->url : ''; }