Custom Nav in Wordpress not Loading Pages

问题

I've created a custom nav in html/css and have applied it to my header.php file in wordpress (with all the page links linking to my html pages). How would I use this nav style as my main nav? ie. whenever I create a page, the page link goes onto the nav? I've tried deleting all the html links but it doesn't seem to work. Here's a link to the site at the moment: http://ixd487.firebird.sheridanc.on.ca/wordpress/

Below is what I pasted into the nav section in my header.php

                    <!-- nav -->
                 <nav class="navbar navbar-expand-lg navbar-dark navbar-site sticky-top0 nav-fill0 navbar-lg0 navbar-transparent0" role="navigation">
    <div class="container">
        <button class="navbar-toggler site-toggler collapsed" type="button" data-toggle="collapse" data-target="#siteMenu" aria-controls="siteMenu" aria-expanded="false" aria-label="Toggle navigation">Menu</button>

        <div class="collapse navbar-collapse" id="siteMenu">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item home-icon">
                    <a class="nav-link" href="index.html">Home</a>
                </li>
                <li class="nav-item ">
                    <a class="nav-link" href="whymac.html">Why McMaster?</a>
                </li>
                <li class="nav-item ">
                    <a class="nav-link" href="co-op.html">Co-Op/Internships</a>
                </li>
                <li class="nav-item ">
                    <a class="nav-link" href="summergrad.html">Summer & Recent Grads</a>
                </li>
                <li class="nav-item ">
                    <a class="nav-link" href="funding.html">Funding</a>
                </li>

                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="https://mps.mcmaster.ca/_staging/bw/elements/#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Recruitment
</a>    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                        <a class="dropdown-item" href="careerfairs.html">Career Fairs</a>
                        <a class="dropdown-item active" href="infosessions.html">Information Sessions</a>

                    </div>
                </li>
                <li class="nav-item ">
                    <a class="nav-link" href="postnow.html">Post Now</a>
                </li>
                <li class="nav-item ">
                    <a class="nav-link" href="contact.html">Contact</a>
                </li>
            </ul>
        </div>
    </div>
</nav>
                    <?php html5blank_nav(); ?>

                <!-- /nav --> 

回答1:

I have reviewed your website but could not find ul with class "navbar-nav mr-auto" as you have mentioned above. Also instead of adding static navigation, use Bootstrap NavWalker to integrate Bootstrap menu with WordPress.

https://github.com/wp-bootstrap/wp-bootstrap-navwalker

回答2:

I've been doing this on my website. First, in functions.php

/**************************************
* My Custom Menu
**************************************/
add_theme_support('menus');
register_nav_menus( array(
  'primary' => __( 'main_menu', 'menu-header' ),
) );

Next, in an includes folder, I use assets/includes. You should use a bootstrap walker menu: https://github.com/wp-bootstrap/wp-bootstrap-navwalker

Now, in your header.php:

<nav class="navbar navbar-default">
    <div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <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="yourwebsitelink"><img class="logo" src="<?php bloginfo('template_url'); ?>/assets/images/logo.png" alt=""/></a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <?php require_once('assets/includes/wp_bootstrap_navwalker.php'); ?>
    <?php
        wp_nav_menu( array(
            'menu'              => 'Menu',
            'theme_location'    => 'menu-header',
            'depth'             => 2,
            'container'         => 'div',
            'container_class'   => 'collapse navbar-collapse nav navbar-nav navbar-right //Custom CS if needed',
            '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><!-- /.container-fluid -->
</nav>

It should create a dynamic boostrap menu.

来源：https://stackoverflow.com/questions/49945373/custom-nav-in-wordpress-not-loading-pages