¿Quieres crear un menú desplegable y agregarlo a tu sitio web de WordPress?

Un menú desplegable muestra una lista de enlaces cuando pasa el mouse sobre un elemento del menú.

Usamos un menú desplegable en , continúe y pase el mouse sobre el menú de navegación en la parte superior.

En esta guía para principiantes, le mostraremos cómo crear fácilmente un menú desplegable en WordPress con instrucciones paso a paso.

¿Por qué utilizar menús desplegables en WordPress?

WordPress viene con un sistema de administración de menús incorporado que le permite agregar fácilmente menús de navegación a su sitio de WordPress.

Los menús de navegación son enlaces a las páginas principales de su sitio web que generalmente aparecen en la parte superior como una fila horizontal justo al lado del logotipo del sitio web.

Menú de navegación típico con una fila horizontal de enlaces

Si está iniciando un blog o creando un sitio web con solo unas pocas páginas, puede agregarlas en una sola fila.

Sin embargo, si tiene una tienda en línea o un sitio web grande, es posible que desee agregar más enlaces al menú de navegación.

Los menús desplegables lo ayudan a resolver el problema del espacio limitado al mostrar enlaces de menú solo cuando los usuarios llevan el mouse sobre un elemento principal. También le permiten organizar la estructura del menú por temas o jerarquía.

Ejemplo de menú desplegable

Por último, también se ven muy bien.

Dicho esto, ahora echemos un vistazo a cómo puede crear fácilmente menús desplegables de WordPress y agregarlos a su sitio web.

Tutorial en video

Suscríbete a

Si no le gusta el video o necesita más instrucciones, continúe leyendo.

Paso 1. Elegir un tema con soporte de menú desplegable

WordPress viene con un sistema de gestión de menús incorporado, pero la visualización de esos menús depende por completo de su tema de WordPress.

Casi todos los temas de WordPress admiten menús desplegables de forma predeterminada. Sin embargo, es posible que algunos temas no tengan el soporte de menú adecuado.

Debe asegurarse de estar utilizando un tema de WordPress que admita menús desplegables.

¿Cómo saber si el tema que está utilizando es compatible con el menú desplegable?

Simplemente puede visitar el sitio web del tema donde encontrará un enlace a la demostración del tema. Desde allí, puede ver si la demostración muestra un menú desplegable en el menú de navegación.

Si no es así, necesitará encontrar un tema de WordPress que lo haga.

Consulte nuestra guía sobre cómo elegir el tema de WordPress perfecto para su sitio web.

Aquí hay algunos temas excelentes que admiten el menú desplegable listo para usar.

  • Astra: es un tema de WordPress multipropósito que viene con varios sitios de inicio y toneladas de características.
  • Temas de StudioPress: construidos sobre el marco de temas de Génesis, estos temas profesionales están altamente optimizados para el rendimiento.
  • OceanWP: un tema popular de WordPress que es adecuado para todo tipo de sitios web.
  • Ultra: impulsado por el constructor Themify, este tema de WordPress de arrastrar y soltar viene con hermosas plantillas y opciones de tema flexibles.
  • Divi: tema popular de Elegant Themes que utiliza el creador de páginas Divi y viene con toneladas de funciones de arrastrar y soltar, incluidos menús desplegables.

Dicho esto, ahora echemos un vistazo a cómo crear un menú desplegable de WordPress.

Paso 1. Creando un menú de navegación en WordPress

Si ya ha configurado un menú de navegación en su sitio web, puede pasar al siguiente paso.

Primero creemos un menú simple.

Ir Apariencia »Menús página y haga clic en el enlace ‘Crear un nuevo menú’ en la parte superior.

Crea un menú

A continuación, debe proporcionar un nombre para su menú de navegación. Este nombre no será visible públicamente en su sitio web. El propósito del nombre del menú es ayudarlo a identificar el menú dentro del área de administración de WordPress.

Nombre del menú

Ingrese un nombre para su menú y luego haga clic en el botón ‘Crear menú’.

WordPress ahora creará un nuevo menú vacío para usted.

Agreguemos los enlaces superiores al menú de navegación. Estos elementos aparecerán en la fila superior de su menú.

Simplemente seleccione las páginas que desea agregar de la columna de la izquierda y haga clic en el botón ‘Agregar al menú’. También puede seleccionar publicaciones de blog, categorías o agregar enlaces personalizados.

Agregar páginas al menú

Ahora verá que esas páginas aparecen en la columna de la derecha debajo de su nuevo menú.

Paso 2. Agregar subelementos a un menú

Los subelementos son los elementos que aparecerán dentro del menú desplegable. Dependiendo de cómo desee organizar sus menús, puede agregarlos en cualquiera de los elementos existentes.

Por el bien de este tutorial, agregaremos categorías debajo del enlace del blog.

Simplemente seleccione los elementos que desea agregar de la columna de la izquierda y luego haga clic en el botón ‘Agregar al menú’. Sus elementos ahora aparecerán en la columna de la derecha.

Nuevos elementos de menú agregados al menú

Sin embargo, estos enlaces aparecerán como elementos normales. Necesitamos convertirlos en un subelemento de un menú principal.

Simplemente puede arrastrar y soltar un elemento del menú y colocarlo debajo del elemento principal. Muévalo ligeramente hacia la derecha y se convertirá en un subelemento.

Agregar elementos de submenú para crear un menú desplegable

Repita el proceso para todos los enlaces que desee mostrar en el menú desplegable.

Una vez que haya terminado, no olvide hacer clic en el botón ‘Guardar menú’ para almacenar sus cambios.

Paso 3. Publica tu menú desplegable

Si está editando un menú que ya está activo en su sitio web, comenzará a aparecer en su sitio web de inmediato.

Sin embargo, si se trata de un nuevo elemento de menú, ahora debe elegir una ubicación de tema para mostrar este menú.

Los temas de WordPress pueden mostrar menús en diferentes ubicaciones. Cada tema define sus propias ubicaciones de menú y puede seleccionar qué menú desea mostrar allí.

Encontrará esta opción en la columna de la derecha en ‘Configuración del menú’. Seleccione una opción junto a la configuración ‘Mostrar ubicación’ y haga clic en el botón ‘Guardar menú’.

Elija la ubicación del tema

Ahora puede visitar su sitio web para ver su menú desplegable en acción.

Vista previa del menú desplegable

Consejos para crear menús desplegables interactivos

Los menús de navegación son importantes porque este es el primer lugar donde los usuarios buscarán si quieren ver información específica.

Usarlos correctamente ayudará a sus usuarios a orientarse en su sitio web. También lo ayudará a obtener más páginas vistas, conversiones y ventas en su sitio web.

Aquí hay algunos consejos para hacer que sus menús de navegación sean más interactivos con menús desplegables.

1. Puede crear menús desplegables de varios niveles

Si convierte un enlace en un subelemento de otro enlace, aparecerá en el menú desplegable. También puede agregar un subelemento debajo de otro subelemento para crear menús desplegables de varios niveles.

Menús de varios niveles

Su tema los mostraría automáticamente como un submenú dentro del menú desplegable.

Menú desplegable de varios niveles

2. También puede crear varios menús desplegables

Puede crear un menú desplegable debajo de cualquier enlace superior en su menú. Incluso puede agregar varios menús desplegables en su menú de navegación principal.

Múltiples menús desplegables en el menú principal

3. Cree menús con una vista previa en vivo

Si su menú se vuelve demasiado complicado, puede cambiar a la vista previa visual. Ir Apariencia »Personalizar para iniciar el personalizador de temas en vivo.

Desde allí, haga clic en la pestaña ‘Menús’ y luego seleccione su menú de navegación. Ahora verá un editor de menú de arrastrar y soltar en la columna izquierda con una vista previa en vivo de su sitio en el panel derecho.

Personalice los menús de WordPress con una vista previa en vivo

4. Creando un mega menú grande como menú desplegable en WordPress

Los menús desplegables solo muestran uno a la vez. ¿Qué pasaría si quisiera mostrar la estructura completa de su sitio web como un mega menú que solo aparece cuando los usuarios se desplazan sobre el menú principal?

Ejemplo de mega menú

Los megamenús aparecen como un menú desplegable, pero pueden mostrar muchos más enlaces, submenús y más. Para obtener instrucciones detalladas, consulte nuestro tutorial paso a paso sobre cómo crear un mega menú en WordPress.

Esperamos que este artículo le haya ayudado a aprender a crear fácilmente un menú desplegable en WordPress. Es posible que también desee ver nuestra guía sobre cómo crear un menú de navegación flotante adhesivo en WordPress y cómo agregar íconos de imagen a los menús de navegación en WordPress.

Si le gustó este artículo, suscríbase a nuestro Canal de Youtube . También puedes encontrarnos en Twitter y Facebook.

.

Fuente: wpbeginner

Entradas relacionadas

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *