Crear zonas de Menú en tu Plantilla WordPress

En ocasiones necesitamos colocar menús en zonas donde por defecto nuestra plantilla no nos lo permite, este pequeño inconveniente se puede solucionar de una manera sencilla y rápida. Te recomiendo que antes de plantearte cambiar de tema le des una oportunidad a esta solución para crear zonas de menú en tu plantilla WordPress.

Te voy a mostrar un ejemplo para crear una nueva zona en el footer para colocar ahí nuestro menú.

1- Función de registro de menús

Si trabajas en un tema hijo tendrás que dirigirte al archivo functions.php que se encuentra en la carpeta child de tu plantilla y añadir al final el siguiente código:

register_nav_menus( array(
'footer' => __( 'Footer Menu' )
) );

Si no trabajas con un tema hijo, busca en tu archivo functions.php la función register_nav_menus y añade esto dentro de la misma:

'footer' => __( 'Footer Menu' )

Con esta función definimos dos cosas:

1. La localización del menú ('footer'), esto nos va a servir más adelante cuando vayamos a mostrar el menú en la parte que queramos de la plantilla, en este caso en el footer.
2. El nombre de la zona, ese será el nombre con el que nos aparecerá en nuestro panel de administración.

2- Crear un menú y ubicarlo en la zona creada

Ahora creamos un menú, lo llamamos "Menú Footer" y le asignamos los items que necesitemos y guardamos.
Nos dirijimos a la pestaña > Gestionar Lugares y veremos que nuestra ubicación 'Footer Menu' ya aparece, ahora solo tenemos que asignarle desde el desplegable el menú que hemos creado, en este caso “Menú Footer”

3- Mostrar el menú en el plantilla

Si vamos a nuestra web, veremos que todavía no aparece el menú en la zona que hemos creado, para eso solo nos falta un último paso. Ahora tenemos que ubicarlo en el footer de nuestra plantilla y para eso necesitamos pegar este código en la parte donde lo queramos mostrar el menú dentro del archivo footer.php

'footer',
'menu_id' => 'footer-menu',
) );
?>

Además de la capa que envuelve al menú y que definimos con div class="nombre-capa" con esta parte del código 'menu_id' => 'footer-menu' le asignamos un id al menú.

Si guardamos el archivo y lo subimos a nuestro servidor ya veremos que nuestro menú se está mostrando.

Ahora tocaría darle algo de estilo con CSS, gracias a la capa que envuelve el menu y al id del mismo podemos darle el aspecto que necesitemos.

Recuerda que con está solución puedes crear tantos menús como necesite tu diseño, con un poco de creatividad y un ligero manejo del CSS podrás hacer autenticas maravillas.

¿Qué te parece esta solución? ¿Conoces alguna otra? Comparte en los comentarios tu experiencia al a hora de crear nuevas zonas de menú o dudas. Estaremos encantados de leerlas.