Es curioso que este script tan popular como CMS no contara con un buen sistema de manejo de menus, recién en esta versión 3 cuenta con esta novedosa función que genera menus usando UL y LI totalmente personalizables, bien podemos usar páginas internas o enlaces externos.

¿Cómo agregar el menu a nuestra plantilla?

La forma más sencilla sería:

1
<?php wp_nav_menu(); ?>

De esa forma coge por defecto el menú principal y usa como contenedores UL y LI

Podemos personalizar un poco nuestro menú, por ejemplo:

1
<?php wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' , 'container'=>'div') ); ?&gt;

En este segundo ejemplo estamos asignando al contenedor la clase «menu-header», estamos indicando que el menu primario y además que el contendor es un div (por defecto se usa UL y LI)

Adicionalmente en el archivo functions.php debemos añadir:

1
2
3
4
<?php register_nav_menus( array(
'primary' => __( 'Primary Navigation', 'twentyten' ),
) );
?>

 

Personalizar el Contenedor

Para eso contamos con las propiedades container y container class y container-id

1
<?php wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary' , 'container'=>'div', 'container-id'=>'mimenu') ); ?>

Eliminar el contenedor

Para eso usamos la la propiedad container pero con un container false

1
<?php wp_nav_menu( array( 'theme_location' => 'primary' , 'container'=>'false') ); ?>

Añadir una clase a un li del menu

Esto no se puede hacer directamente con el wp nav menu si no que debemos añadir una función en el functions.php como la siguiente:

1
2
3
4
5
function custom_nav_class($classes, $item){
$classes[] = "mi-clase-personalizada";
return $classes;
}
add_filter('nav_menu_css_class' , 'custom_nav_class' , 10 , 2);