wp_nav_menu()

wp_nav_menu() renderiza un menú de navegación de WordPress. Genera automáticamente el HTML con la estructura de lista, clases CSS de estado activo y soporte para submenús.

Uso básico

wp_nav_menu([
    'theme_location' => 'primary', // zona de menú registrada con register_nav_menus()
]);

Todos los parámetros principales

wp_nav_menu([
    'theme_location'  => 'primary',   // zona de menú del tema
    'menu'            => 'Mi menú',   // o nombre/ID/slug del menú específico
    'container'       => 'nav',       // elemento envolvente: 'div', 'nav', false
    'container_class' => 'main-nav',  // clase del contenedor
    'container_id'    => 'nav-main',  // ID del contenedor
    'menu_class'      => 'nav-list',  // clase del <ul>
    'menu_id'         => 'menu-main', // ID del <ul>
    'echo'            => true,        // false = devuelve en lugar de imprimir
    'fallback_cb'     => false,       // qué mostrar si no hay menú asignado
    'depth'           => 2,           // niveles de submenú (0 = todos)
    'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
]);

HTML que genera

<nav class="main-nav">
    <ul id="menu-principal" class="nav-list">
        <li class="menu-item current-menu-item"><a href="/">Inicio</a></li>
        <li class="menu-item menu-item-has-children">
            <a href="/blog/">Blog</a>
            <ul class="sub-menu">
                <li class="menu-item"><a href="/category/php/">PHP</a></li>
            </ul>
        </li>
    </ul>
</nav>

Clases CSS automáticas en los items

  • current-menu-item — página actual
  • current-menu-ancestor — ancestro de la página actual
  • menu-item-has-children — tiene submenú

Obtener el menú como string

$menu_html = wp_nav_menu([ 'theme_location' => 'primary', 'echo' => false ]);