¿Desea crear un menú desplegable y agregarlo a su sitio web de WordPress?
Un menú desplegable muestra una lista de enlaces al pasar el mouse sobre un elemento del menú.
Utilizamos un menú desplegable en WPBeginner, adelante 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é usar menús desplegables en WordPress?
WordPress viene con un sistema de gestió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.
Si está iniciando un blog o creando un sitio web con solo unas pocas páginas, puede agregarlos en una sola fila.
Sin embargo, si ejecuta 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 de espacio limitado al mostrar enlaces de menú solo cuando los usuarios acercan el mouse a un elemento principal. También le permiten organizar la estructura del menú por temas o jerarquía.
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.
Video Tutorial
Suscríbase a WPBeginner
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 mostrar esos menús depende completamente de su tema de WordPress.
Casi todos los temas de WordPress admiten menús desplegables de forma predeterminada. Sin embargo, algunos temas pueden no tener 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 admite 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 perfecto de WordPress para su sitio web.
Aquí hay algunos temas excelentes que admiten el menú desplegable de fábrica.
-
Astra: es un tema multipropósito de WordPress que viene con varios sitios de inicio y toneladas de características.
-
Temas de StudioPress: creados sobre el marco de temas de génesis, estos temas profesionales están altamente optimizados para el rendimiento.
-
OceanWP: un tema popular de WordPress adecuado para todo tipo de sitios web.
-
Ultra – Desarrollado por Themify Builder, este tema de WordPress de arrastrar y soltar viene con hermosas plantillas y opciones de temas 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. Crear 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.
Vamos a crear un menú simple primero.
Ir Apariencia »Menús página y haga clic en el enlace “Crear un nuevo menú” en la parte superior.
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.
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 principales 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 izquierda y haga clic en el botón “Agregar al menú”. También puede seleccionar publicaciones de blog, categorías o agregar enlaces personalizados.
Ahora verá que esas páginas aparecen en la columna 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. Según cómo desee organizar sus menús, puede agregarlos debajo de cualquiera de los elementos existentes.
Por el bien de este tutorial, agregaremos categorías en el enlace del blog.
Simplemente seleccione los elementos que desea agregar de la columna izquierda y luego haga clic en el botón “Agregar al menú”. Sus artículos ahora aparecerán en la columna derecha.
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 sub-elemento.
Repita el proceso para todos los enlaces que desea 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 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ú”.
Ahora puede visitar su sitio web para ver su menú desplegable en acción.
Consejos para crear menús desplegables interactivos
Los menús de navegación son importantes porque este es el primer lugar donde buscarán sus usuarios si desean 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 sobre cómo hacer que sus menús de navegación sean más interactivos con los menús desplegables.
1. Puede crear menús desplegables de varios niveles
Hacer que un enlace sea un subelemento de otro enlace hace que aparezca en el menú desplegable. También puede agregar un subelemento debajo de otro subelemento para crear menús desplegables de varios niveles.
Su tema los mostrará automáticamente como un submenú dentro del menú desplegable.
2. También puedes crear múltiples menús desplegables
Puede crear un menú desplegable debajo de cualquier enlace superior en su menú. Incluso puede agregar múltiples menús desplegables en su menú de navegación principal.
3. Crear menús con una vista previa en vivo
Si su menú se complica demasiado, 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.
4. Crear un gran mega menú como menú desplegable en WordPress
Los menús desplegables solo muestran un menú desplegable a la vez. ¿Qué sucede si desea mostrar la estructura completa de su sitio web como un mega menú que solo aparece cuando los usuarios se desplazan en el menú principal?
Los mega menú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 te haya ayudado a aprender cómo crear fácilmente un menú desplegable en WordPress. También puede consultar nuestra guía sobre cómo crear un menú de navegación flotante adhesivo en WordPress y cómo agregar iconos de imagen a los menús de navegación en WordPress.
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para ver videos tutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.
