{dev_notes}

WordPress Menus

Published 3 years ago.
Last updated

A navigation menu is a list of links to important pages of a website. Navigation menus give your site structure and help visitors find what they’re looking for.

Menu Locations

In WordPress Navigation Menus or just Menus are a theme feature which allow admin users of a WP site to create navigation menus and then assign those menus to menu locations defined by a theme.

How many menu locations exist and where they’re located is defined by the theme. Most WordPress themes offer at least one menu location for the site’s main navigation links.

Manage Menus

An admin user can create and manage menus with the built-in Menu Editor in the admin area under Appearance » Menus. Posts, pages, and custom links can be added to a menu using drag and drop functionality.

Admin user created menus can also be put in sidebars under Appearance » Widgets by adding the Navigation Menu widget to a sidebar and then selecting the users menu from the “Select Menu” drop down list.

By default widgets cannot be put into menus in WordPress although plugins do exist to make that possible.

More Resources

Use Menus in a Theme

To use menus in a theme:

  • Enable Theme Support for Menus
    Register the Menus Theme Feature in the functions.php file.
  • Register Menu Locations
    Register each menu location using register_nav_menu().
  • Display Menu Locations
    Display each menu location using wp_nav_menu() within template files.

More Resources

Enable Theme Support for Menus

Before menus can be used they must be supported by the theme. Call add_theme_support() to enable menu support in a theme and add the Edit Menus admin page under Appearance > Menus:

Call add_theme_support() from the functions.php file using the after_setup_theme action hook:

add_action('after_setup_theme', 'my_after_setup_theme');
function my_after_setup_theme() {
    add_theme_support('menus');
}

More Resources

Register a Menu Location

Every menu location appearing in a theme must be registered by calling register_nav_menu() and passing at least:
$location: The menu location identifier, like a slug.
$description: A description identifying the menu for the admin dashboard.

Call register_nav_menu() from the functions.php file using the init action hook:

add_action('init', 'my_init' );
function my_init() {
    // Register the "Main Menu" location.
    register_nav_menu(
        'main-menu', // The menu location identifier.
        __('Main Menu', 'my-text-domain')
    );
}

More Resources

Display a Menu Location

Use wp_nav_menu() in a template file to display the menu assigned to this location by an admin user.

Call wp_nav_menu() from the index.php template file using the after_setup_theme action hook:

<nav class="main-nav">
<?php wp_nav_menu(array(
    'theme_location' => 'main-menu', // The menu location identifier.
    'container' => 'false',
    'items_wrap' => '<ul>%3$s</ul>',
)); ?>
</nav>

NOTE: If a menu location is displayed in a template which has NOT been registered, WordPress will substitute it’s own menu content (which is probably undesirable).

More Resources