Mostrar menú de WordPress con Shortcode:
Lo primero que debemos hacer es trabajar en nuestro archivo «functions.php».
Aquí tienes el código que te permitirá mostrar el menú, solo debes copiarlo y pegarlo en el archivo functions.php de tu tema hijo.
/**
* Shortcode para mostrar un menú de WordPress
*/
function rv_print_menu_shortcode( $atts ) {
/**
* Normalize
*
* Como medida de seguridad limpiamos los atributos
* introducidos al escribir el Shortcode.
*/
$atts = array_change_key_case( (array) $atts, CASE_LOWER );
$atts = array_map( 'sanitize_text_field', $atts );
/**
* Atributtes
*
* A continuación guardamos los atributos en 2 variables
*/
$menu_name = $atts['name'];
$menu_class = $atts['class'];
/**
* Creamos la variable $menu_output que va a retornar todo
* lo que conforma nuestro menú y llamamos a la función
* de WordPress wp_nav_menu() y le pasamos como
* parámetros nuestros atributos.
*/
$menu_output = '<div class="shortcode-menu">';
$menu_output .= wp_nav_menu( array(
'menu' => esc_attr( $menu_name ),
'menu_class' => 'menu ' . esc_attr( $menu_class ),
'echo' => false
) );
$menu_output .= '</div>';
return $menu_output;
}
add_shortcode( 'print-menu', 'rv_print_menu_shortcode' );
Para que puedas usar el Shortcode y mostrar el menú donde quieras, solo tienes que copiar y pegar la siguiente línea de código (shortcode)
[print-menu name="nombre-menu"]
solo tienes que cambiar el parámetro name=»nombre-menu» por el nombre que le has puesto a tu menú de WordPress.
Ejemplo:
Por ejemplo, en la siguiente imagen yo tengo una menú de WordPress que se llama prueba.
Y el Shortcode que tengo que escribir es el siguiente:
[print-menu name="prueba"]
Agregar una clase CSS a tu menú:
Para ello solo tienes que añadir class=»nombre-clase» tal como aparece en en siguiente ejemplo:
[print-menu name="nombre-menu" class="nombre-clase"]
También puedes añadir varias clases a la vez incluyendo un espacio entre cada una de ellas.
[print-menu name="nombre-menu" class="nombre-clase1 nombre-clase2"]
