Añadir un nuevo menú en wordpress

Cuando realizamos la tarea de construir nuestro propio template en wordpress es inevitable pasar por alto el tener que añadir uno o varios menús, las siguientes lineas te pueden ayudar a conseguirlo:

Antes de mostrar el nuevo menú debemos registrarlo, para ello utilizaremos el action «init» y crearemos la función «template_softcreative_registro_menus» en nuestro function.php del template a modificar:

function template_softcreative_registro_menus() {
    register_nav_menus(
        array(
            'primary_menu' => __( 'Primary Menu', 'template_softcreative_registro_menus' ),
        )
    );
}
add_action( 'init', 'template_softcreative_registro_menus' );

Podemos registrar varios menú desde la misma función:

register_nav_menus(
        array(
            'primary_menu' => __( 'Primary Menu', 'template_softcreative_registro_menus' ),
            'aux_menu' => __( 'Footer Menu', 'template_softcreative_registro_menus' ),
        )
    );

Si entramos en el panel de administración de wordpress «Apariencia» > «Menús» podemos ver que el nuevo menú ya está disponible para añadirle algún item.

En nuestro index.php ya podemos mostrar el menú registrado anteriormente:

<?php wp_nav_menu( array( 'theme_location' => 'primary_menu' ) ); ?>

Ya estaríamos y obtendriamos algo como esto:

<div class="menu">
	<ul>
		<li>
			<a href="http://misito.com/servicios" title="Servicios">Servicios</a>
		</li>
		<li>
			<a href="http://mysite.com/about" title="About">About</a>
		</li>
	</ul>
</div>

A veces necesitamos adaptar lo que nos devuelve wordpress por defecto…

<nav>
	<ul>
	  <li><a href="default.asp">Home</a></li>
	  <li><a href="news.asp">News</a></li>
	  <li><a href="contact.asp">Contact</a></li>
	  <li><a href="about.asp">About</a></li>
	</ul> 
</nav>

La función wp_nav_menu de wordpress tiene multiples parámetros para modificar su salida y adaptarla a nuestros proyectos, el siguiente array muestra los parámetros por defectos:

$defaults = array(
	'theme_location'  => '',
	'menu'            => '',
	'container'       => 'div',
	'container_class' => '',
	'container_id'    => '',
	'menu_class'      => 'menu',
	'menu_id'         => 'menu-{menu slug}',
	'echo'            => true,
	'fallback_cb'     => 'wp_page_menu',
	'before'          => '',
	'after'           => '',
	'link_before'     => '',
	'link_after'      => '',
	'items_wrap'      => '<ul id="%1$s" class="%2$s">%3$s</ul>',
	'depth'           => 0,
	'walker'          => ''
);

wp_nav_menu( $defaults );

Parámetros de wp_nav_menu:

• items_wrap: Formato del elemento theme_location: Nombre de menú que hemos dado de alta en la función «register_nav_menus» en este caso «primary_menu»
• menu: Acepta, en este orden, id, slug o nombre del menú a mostrar.
• container: Elemento que envuelve el menú. Admite div y nav, en caso de no querer envolverlo indicamos false.
• container_class:Atributo class del elemento container (div,nav indicado anteriormente).
• container_id: Atributo id del container (div,nav indicado anteriormente).
• menu_class: Atributo class del elemento
  que envuelve al menú. Podemos indicar varios separados por espacios.
• menu_id: Atributo id del elemento
  que envuelve al menú. Por defecto menu-{menu slug}.
• echo: Guardar el menú en una variable. Por defecto: true
• fallback_cb: Función llamada en caso que el menú no exista. Por defecto, wp_page_menu. false para no llamar a ninguna función.
• before: Texto antes del elemento <a>.
• after: Texto después del elemento <a> .
• link_before: Texto antes del texto del enlace.
• link_after: Texto después del texto del enlace.
• items_wrap: Formato del elemento <ul> a través de la expresión sprintf. Ej.: %1$s = “menu_id”, %2$s = “menu_class”, y %3$s el valor de <li>
• depth: Niveles de submenús, 0 muestra todos los niveles.
• walker: Objeto walker a usar, por defecto: new Walker_Nav_Menu