fullpage.js 和 wordpress 导航

Question

我正在尝试在我的 WordPress 主题中实现 fullpage.js。一切正常，但我找不到将标准 WordPress 导航与 fullpage.js 锚点一起使用的方法。

这就是我获取页面的方式：

<?php $query = new WP_Query( 'page_id=5' ); ?>
<?php if( $query->have_posts() ): ?>
<?php while ( $query->have_posts() ) : $query->the_post(); ?>    
<div class="section" id="section0">
     <div class="content">
         <div class="row">
             <div class="col-sm-4">
                <div class="content-text">
                    <h1 class="headline-about"><?php the_title(); ?></h1>
                    <?php the_content(); ?>
                </div>
            </div>
         </div>
     </div>
</div>
<?php endwhile; ?>
<?php endif; ?>

这是我的标题，包括导航。

    <header>
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
        <div class="container"><a href="<?php bloginfo('url') ?>"><img id="logo-main" class="img-responsive" src="<?php bloginfo('template_directory'); ?>/img/birnis-logo.png"></a></div>
        <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 navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
              </button>
            </div>
              <div class="collapse navbar-collapse">
                   <?php
                      wp_nav_menu( array(
                      'theme_location' => 'top_menu',
                      'depth' => 0,
                      'container' => false,
                      'menu_class' => 'nav navbar-nav',
                      'fallback_cb' => 'wp_page_menu',
                      //Process nav menu using our custom nav walker
                      'walker' => new wp_bootstrap_navwalker())
                      );
                    ?>
              </div><!--/.nav-collapse -->
        </div>
   </nav>
</header>

我在这里加载 fullpage.js

    <script type="text/javascript">
    $(document).ready(function() {
        $('#fullpage').fullpage({
            verticalCentered: false,
            anchors: XXX,
            menu: '.nav'
        });
    });
</script>

有没有办法改变代码，这样每次我在菜单中添加一个页面时，它都会自动添加一个新的锚点？

例如，我创建了一个具有不同 page_id 的新部分。 之后，我将该页面添加到 WordPress 后端的菜单中。 现在我希望新的列表项滚动到右侧部分。

我希望你能理解我想要达到的目标。

感谢您的宝贵时间，非常感谢您的回答！

Answer 1

我在您的标记中没有看到任何带有“nav”类的元素。 看来您必须在 menu 选项中使用 nav 而不是 .nav：

$(document).ready(function() {
    $('#fullpage').fullpage({
        verticalCentered: false,
        anchors: XXX,
        menu: 'nav'
    });
});