Crear Nuevo Menú de Navegación en WordPress

Crear Nuevo Menú de Navegación en WordPress con código

Los menús en los sitios web son muy importantes, ya que sirven de timón o volante para los visitantes y usuarios, y WordPress no es la excepción, si tienes un sitio web, entonces debes configurar y crear nuevo menú de navegación que contiene enlaces bien claros sobre la estructura de tu sitio web, para que los visitantes puedan navegar con facilidad. Hoy te mostraremos cómo crear un nuevo menú en WordPress personalizado para controlar la presentación estructual de tu sitio.

Menú de Navegación en WordPress

Un menú de navegación es una característica de los temas, introducida en la versión 3.0 de WordPress, y es un mecanismo de introducir o presentar menús de naveación personalizables en una tema.

Todos los temas de WordPress incluyen como mínimo un menú de navegación principal, donde incorporas las páginas y enlaces de tu sitio web desde la sección Apariencia :: Menús en el panel de administración.

WordPress es un gestor de contenido altamente flexible, y lo más importante extendible, y te permite heredar características de los menús para que puedas agregar nuevo menú personalizado en tu tema.

Crear Nuevo Menú de Navegación

Para añadir nuevo menú personalizable en tu sitio web, es necesario hacer algunos cambios en los archivos de la instalación. Antes de realizar cambios, te invitamos a crear una copia de respaldo backup fresca de tu archivos.

Y si no estas acosumbrado a hacer modificaciones o añadir código, te recomendamos leer el artículo de cómo editar archivos en WordPress de forma correcta.

function nuevo_menu_wpbody() {
  register_nav_menu('nuevo-menu-wpbody',__( 'Mi Primer Menú' ));
}
add_action( 'init', 'nuevo_menu_wpbody' );

Primero es necesario registrar un menú de navegación en tu tema actual, para ello debes acceder a los archivos del tema, y abrir el archivo functions.php para registrar una nueva ubicación del menú de navegación.

Crear Nuevo Menú de Navegación con register_nav_menu en WordPress

Este código crea una nueva casilla en la sección de menús, que relaciona cualquier nuevo menú que creas con una determinada ubicación dentro de tu tema.

Para mostrar el menú que añades desde la sección Apariencia :: Menús, sólo marcas la casilla de “Mi Primer Menú” después de agregar las páginas y enlaces al menú, y guardas las modificaciones. El menú aparecerá en el lugar donde lo llamas mediante este código.

wp_nav_menu( array( 'theme_location' => 'nuevo-menu-wpbody' ) ); 

En el valor de theme_location, asignamos el nombre definido al menú que hemos creado con el código anterior, que es nuevo-menu-wpbody. Este código es suficiente para mostrar el menú asignado.

Debes insertaar este código en la página de tu sitio web en la ubicación donde quieres que aparezca dicho menú de navegación, por ejemplo un menú de pie de página sería en el archivo footer.php de tu tema actual, por ejemplo:

<footer id="colophon" class="site-footer" role="contentinfo">
    <?php wp_nav_menu(array('theme_location' => 'nuevo-menu-wpbody')); ?>
</footer>

Esto no es todo, ya que puedes asignar también clases CSS personalizadas para estilizar el menú y darle una apariencia que combina con tu tema. Para añadir las clases, sólo agregas otro valor con el nombre container_class como el ejemplo de abajo.

wp_nav_menu( array(
    'theme_location'  => 'nuevo-menu-wpbody',
    'container_class' => 'clase-nuevo-menu',
    )
);

Lo que hacemos en este código es crear una clase con el nombre clase-nuevo-menu para estilizar su apariencia de una forma conveniente. Esta clase la puedes usar desde el archivo style.css en tu tema actual, o en el archivo de estilo del tema hijo.

.clase-nuevo-menu {
    background: #fff;
}

Con esto terminas de crear nuevo menú de navegación en tu sitio web para mostrar tu contenido bien estructurado y de forma navegable para los visitantes.

Si te gusta este artículo, te invitamos a compartirlo, y seguirnos por facebook y google+, también puedes hacerlo por twitter, donde compartimos contenido actualizado sobre WordPress.

DEJAR COMENTARIO

Favor escribir tu comentario!
Favor ingresar tu nombre aquí