Wordpress custom theme - menu not showing when called in footer.php

Question

I'm trying to create custom website theme for Wordpress and I ran into a bit of a problem. I use two absolutely same menus in my header and footer part of website.

Calling

wp_nav_menu(array('theme_location' => 'header'));

in header.php works well, the menu prints out without any problem, but if I do the same in my footer.php file, the menu doesn't print and var_dump(wp_nav_menu(array('theme_location' => 'header'))); prints false.

I've tried some workarounds that I found on Google with modifying the functions.php file, but none of them helped me resolve that problem. My functions.php file now consists of only one line

register_nav_menus( array( 'header' => 'Header menu', 'footer' => 'Footer menu' ) );

and yes, I tried to use

wp_nav_menu(array('theme_location' => 'footer'))

as well, with same result. If I call the same function from header.php

wp_nav_menu(array('theme_location' => 'footer'))

the menu works good.

Stir

Answer 1

You have registered you two nav menus correctly. I always do that within my initial theme setup hook that gets hooked to the after_setup_theme hook. So I would do something like this in your functions.php:

function pietergoosen_theme_setup() {
  register_nav_menus( array( 
    'header' => 'Header menu', 
    'footer' => 'Footer menu' 
  ) );
 }

add_action( 'after_setup_theme', 'pietergoosen_theme_setup' );

Keep in mind, you don't have to do it this way. The following also works

register_nav_menus( array( 
        'header' => 'Header menu', 
        'footer' => 'Footer menu' 
      ) );

You should now see the two menus in the backend under "Appearance > Menus > Manage Locations" (Only if a menu exist)

For the sake of the footer menu, add the following code in your footer where you need to display the menu:

<nav id="footer-navigation" class="site-navigation footer-navigation" role="navigation">
       <?php wp_nav_menu( array( 'theme_location' => 'footer', 'menu_class' => 'nav-menu', 'fallback_cb' => false ) ); ?>
</nav>

At this stage nothing will be displayed, and I think this is where you also get stuck at. The reason for this is that there aren't any items assigned to the menu, and if there are nothing assigned to a menu, then nothing will be displayed. So we have to insert something to be displayed.

In the backend, go to "Appearance > Menus > Edit Menus". In the "Menu Name" field, enter a name for your menu and click "Create Menu". You will now be able to add the menu in the menu screen.

You can now choose items from the left hand side to insert into your menu. You can also set the location of the menu, in this case in the footer. I've selected to display the categories in the footer. Click "Save Menu" when done.

You should now see your nav menu in the front end.

You just have to add styling to your nav bar now. You will do exactly the same for the header nav menu, accept you will add the call to the menu in the header.php. I hope you find this usefull.

Falcongentle

Fantastic answer - You've gone above and beyond the call of duty here. – Wilmot

Thanks for your answer, this helped, I did the same steps as you did, but probably skipped one so it didn't work, I went through the whole creation of menu again following your steps and it's working now. – Stir

Answer 2

So I’m producing my second WP theme and I’ve struck a problem. As well as the standard Nav menu at the top of my pages, the Footer element contains three individual sub-menus that can be loaded with individual entries. These are broken into three areas: Product Range, Industry Type and Services. The source code on footer.php is thus:

<div class="col-sm-3" style="float:left">
    <h3>Product Range</h3>
    <?php wp_nav_menu( array( 'footer' => 'product-range', 'container_class' => 'footer-menu' ) ); ?>
</div>
<div class="col-sm-3" style="float:left">
    <h3>Industry Type</h3>
    <?php wp_nav_menu( array( 'footer' => 'industry-type', 'container_class' => 'footer-menu' ) ); ?>
</div>
<div class="col-sm-3" style="float:left">
    <h3>Services</h3>
    <?php wp_nav_menu( array( 'footer' => 'services', 'container_class' => 'footer-menu' ) ); ?>
</div>

In functions.php I have included:

*Add footer Menus
*/
    function register_my_menus() {
    register_nav_menus(
        array(
           'product-range' => __( 'Product Range' ),
           'industry-types' => __( 'Industry Types' ),
           'services' => __( 'Services' )
        )
     );
}

add_action( 'init', 'register_my_menus' );

The output to all three menus is identical, and it is not what I want:

Product Range

COVID19 Policy
Latest and Greatest
About Us
Contact us1
Customer Service
Our Guarantee

Industry Type

COVID19 Policy
Latest and Greatest
About Us
Contact us1
Customer Service
Our Guarantee

Services

COVID19 Policy
Latest and Greatest
About Us
Contact us1
Customer Service
Our Guarantee 

The top two items I added in the CMS, the remainder are automatically generated form somewhere else?

What gives?

Tuna

This does not really answer the question. If you have a different question, you can ask it by clicking Ask Question. To get notified when this question gets new answers, you can follow this question. Once you have enough reputation, you can also add a bounty to draw more attention to this question. - From Review – Sunshinesunspot