icon mail

Cómo agregar más menús de navegación a theme WordPress

abril 9, 2015

A veces cuando creamos un theme wordpress o simplemente deseamos agregar un menú adicional a nuestro diseño del theme que usamos, para aumentar la usabilidad de nuestro sitio wordpress, quiero resaltar que existen plugins que pueden hacer este trabajo pero como sabrán la sobre carga de plugins pueden hacer que su sitio sea pesado. Es por eso que hoy quieres enseñarles lo simple que puede llegar a ser crear y/o agregar un menú adicional a nuestra theme wordpress, manos al código!

Agregar solo un Menú más

En la carpeta raíz de tu theme, específicamente en el archivo Functions.pnp agregar el siguiente código, recuerda abrir y cerra la etiqueta php como lo muestro a continuación.

<?php
function registrar_mi_menu() {
  registrar_nav_menu('nuevo-menu',__( 'Nuevo Menu' ));
}
add_action( 'init', 'registrar_mi_menu' );
?>

En este ejemplo Nuevo Menú es el nombre que aparecerá en el panel de administración de wordpress, específicamente en: (apariencia > Menús) cuando estés dentro de los menús te recomiendo «crear un nuevo menú» para que dentro de ello hagas el menú que deseas.

bueno ahí no termina, tienes que agregar el siguiente código en el lugar donde quieres que aparezca, por ejemplo digamos que lo deseas en el Footer, entonces tendrás que abrir tu archivo footer.php de tu theme y agregar este código.

<?php wp_nav_menu( array( 'theme_location' => 'nuevo-menu' ) ); ?>

Agregar mas de un Menú

bueno ya sabemos como agregar un menú mas a nuestro theme, entonces este nos será fácil, agregaremos mas de 1 menu, en esta ocación agregaremos 3 menu.
como en el 1er ejemplo este código también lo agregaremos en nuestro archivo functions.php de nuestro theme.

function registrar_mis_menus() {
  registrar_nav_menus(
    array(
      'nuevo-menu' => __( 'Nuevo Menu' ),
      'otro-menu' => __( 'Otro Menu' ),
      'extra-menu' => __( 'Extra Menu' )
    )
  );
}
add_action( 'init', 'registrar_mis_menus' );

de esta manera puedes añadir tantos menus como quieras usando la mismas reglas, guarda todos los cambios, ahora solo queda adicionarlo a nuestro theme de igual manera como el 1er ejemplo. puedes agregarlo en cualquier parte de tu theme, solo pega su código correspondiente para hacer la llamada al menú deseado.

Agregando el «Nuevo Menú»

<?php wp_nav_menu( array( 'theme_location' => 'nuevo-menu' ) ); ?>

Agregando «Otro Menú»

<?php wp_nav_menu( array( 'theme_location' => 'otro-menu' ) ); ?>

Agregando «Entra Menú»

<?php wp_nav_menu( array( 'theme_location' => 'extra-menu' ) ); ?>

Tip

Es posible que quieras darle estilos CSS a tu nuevo menú, para eso tenemos que agregar una clase al mismo, en ese caso agregaremos la clase «nuevo_menu_clase».
Al igual que los ejemplos anteriores reemplaza «nuevo-menu» por el menú que desea agregar, y también puedes modificar el nombre de la clase «nuevo_menu_clase» por el que desees.

<?php wp_nav_menu( array( 'theme_location' => 'nuevo-menu', 'container_class' => 'nuevo_menu_clase' ) ); ?>

Relacionados