php - 使用 bootstrap 3 在自定义主题中注册和使用菜单

Question

我正在创建我的第二个自定义 WordPress 主题并遇到问题。

我在第一个主题中使用了相同的方法并且效果很好，但这次当然不行。

我像这样在 functions.php 中注册了我的菜单:

<?php  
//Register main menu
function register_theme_menu() {
    register_nav_menu( 'primary', 'Main Navigation Menu' );
}
add_action( 'init', 'register_theme_menu' );
?>

然后像这样在我的 header.php 中调用菜单:

<!-- Menu -->   
                    <nav class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner">
                        <div class="navbar-header">
                          <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bs-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>
                        <nav class="navbar-collapse bs-navbar-collapse collapse" role="navigation">
                          <ul class="nav navbar-nav">
                            <?php wp_nav_menu( array( 
                                    'theme_location' => 'main-menu',
                                    'menu_class' => 'nav navbar-nav'
                            ) ); ?>
                          </ul>
                        </nav>
                <!-- End menu -->

我在 WP 后端设置了 mu 菜单，但它没有响应，它只是在前端列出了我的所有页面。我哪里错了？

谢谢

Answer 1

这是因为您已将 primary 作为 register_nav_menu() 函数的第一个参数传入，并且您正在将 main-menu 传入模板。

<nav class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner">
    <div class="navbar-header">
        <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".bs-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>
<nav class="navbar-collapse bs-navbar-collapse collapse" role="navigation">
    <ul class="nav navbar-nav">
    <?php wp_nav_menu( array( 
        'theme_location' => 'primary',
        'menu_class' => 'nav navbar-nav'
     ) ); ?>
     </ul>
</nav>

无偿建议

最好使用 https://github.com/twittem/wp-bootstrap-navwalker对于 Wordpress/Bootstrap 主题，因为菜单很难实现。网上有很多关于如何实现它的教程。这是因为如果你的关卡超过 2 层，菜单就会中断 :-( 糟糕的时候。