questions

wp_nav_menu Returning nothing

Rate this post

So I have come to move my HTML site over to wordpress and im having issues with the menu. None of the links listed in the admin panel pull through.

header.php code:

<nav>
<?php
wp_nav_menu(array(
  'theme_location' => 'top-menu',
  'items_wrap'=> '<ul class="nav__links"><li>',
  'container' => '',
));
?>
</nav>

This is the nav bar html:

<nav>
  <ul class="nav__links">
    <li><a class="un" href="#">Home</a></li>
    <li><a class="un" href="#">Services <i class="fas fa-chevron-down"></i></a>
      <ul class="dropdown">
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
        <li><a href="#">Broadband</a></li>
      </ul>
    </li>
    <li><a class="un" href="#">Customers</a></li>
    <li><a class="un" href="#">News & Blog</a></li>
    <li><a class="un" href="#">About us</a></li>
    <li><a class="un" href="#">Contact</a></li>
  </ul>
</nav>

The code in my functions.php file:

function wp_custom_new_menu() {
register_nav_menus(
  array(
    'top-menu' => __( 'Top Menu' ),
    'mobile' => __( 'Mobile Menu' )
  )
);}add_action( 'init', 'wp_custom_new_menu' );

This is what is being pulled through:

<nav>
<ul class="nav__links"><li>    </li></ul></nav>

Im not entirely sure why its doing this, There is definitly a menu created within the wordpress admin area. Display location top menu has been checked also.

Any pointers would be great.

Thanks.

 

✔️Solution:

items_wrap'usually defines the elements that wrap the li elements of the menu, so having an <li> tag here (like in your code) would cause li elements as direct children of that li, which is not valid HTML (i.e. submenus would require ul children of li in between). That most likely is the cause for nothing showing up.

So you’d have to delete that <li>, and also add a closing </ul>. But actually it should be sufficient to use 'menu_class' => 'nav__links' instead of that. The wrapping of the menu items inside ul and li tags happens automatically, and menu_class adds a class to the ul.

So the resulting php code would be

<?php
 wp_nav_menu(array(
  'theme_location' => 'top-menu',
  'menu_class' => 'nav__links',
  'container' => '',
 ));
?>

Leave a Reply

Your email address will not be published.

Back to top button