En este artículo te contamos cómo crear un menú desplegable en wordpress paso a paso con capturas de pantalla! Puede hacer cualquier cosa con la funcionalidad básica de WordPress, sin necesidad de un complemento de terceros. Las funciones de navegación deficientes pueden dañar la facilidad de uso y la accesibilidad de un sitio web bellamente diseñado. Es sumamente importante que sus usuarios tengan acceso fácil y rápido a lo que necesitan en su sitio web.
Especialmente si ha acumulado muchas páginas y publicaciones, un menú de navegación bien planificado facilitará que los usuarios descubran todo lo que tiene para ofrecer. Esta característica simple también puede ayudar a reducir las tasas de rebote, haciendo que sus visitantes duren más tiempo. Así que vamos a ver cómo crear un menú desplegable en WordPress, pero antes vamos a explicar qué es un menú desplegable para despejar dudas. ¡Empecemos!
Te puede interesar: Formas de agregar un formulario de suscripción en WordPress
¿Qué es un menú desplegable?
El menú predeterminado que se utiliza en Internet es el menú estándar. Es un proyecto sencillo en el que cada elemento del menú se muestra uno al lado del otro horizontalmente (a veces verticalmente). El diseño no contiene elementos anidados, por lo que se parece a lo que ve.
Un menú desplegable es una variación del menú estándar de Internet. Utiliza el mismo diseño, solo unos pocos elementos de menú tienen elementos anidados que se «expanden» cuando el usuario pasa el cursor sobre un elemento principal.
El diseño ofrece una manera fácil de proporcionar al usuario más enlaces, lo que facilita la navegación por el sitio.
Cómo crear un menú desplegable en WordPress: paso a paso
Hay diferentes tipos de menús de navegación, como habrás notado al visitar varios sitios web. Echemos un vistazo a algunas de las opciones más populares. Probablemente el tipo más popular es el menú de encabezado:
Sin embargo, los menús de la barra lateral también son muy visibles:
En los sitios móviles, también verá varios menús de hamburguesas que se expanden cuando hace clic en el icono de la hamburguesa:
El ejemplo final que también crearemos más adelante en esta publicación es un menú desplegable. Al igual que el menú de hamburguesas, este estilo ahorrar espacio en la pantallaporque la mayor parte del contenido está oculto hasta que se necesita:
Tenga en cuenta que algunos temas no admiten menús desplegables. Lo primero que querrá hacer es confirmar que su tema ofrece esta opción. Por lo general, puede averiguarlo mirando la documentación de un tema.
En el siguiente tutorial, le mostraremos cómo usar funciones nativas para crear un menú desplegable en WordPress. La ventaja de este método es que mantendrá el menú que creó incluso si cambia de tema o agrega nuevos complementos a su sitio web en el futuro.
Paso 1: crea los elementos del menú
Para empezar, vaya a Apariencia > Menú en el tablero de WordPress. Las opciones disponibles estarán parcialmente determinadas por su tema actual. Haga clic en la pestaña Editar el menúdonde puede optar por crear un nuevo menú:
Ingrese un nombre en el campo de entrada debajo de la sección Estructura del menú luego haga clic crear un menú:
Después de crear al menos un menú, debería ver una nueva pestaña titulada Administra tus ubicacionesjusto al lado Editar el menú.
Ahora puede comenzar a agregar elementos a su menú. Puede incluir páginas personalizadas, publicaciones y URL. Por ejemplo, para agregar una página, marque las casillas junto al contenido que desea agregar en la sección paginas derecha, luego seleccione Agregar al menú:
El mismo proceso se aplica a las publicaciones. Si desea agregar un enlace a su menú, expanda la sección enlaces personalizados e ingrese la URL y el texto personalizado:
Puede seguir pasos similares para agregar categorías a su menú expandiendo una sección Categorías. Cada elemento de menú creado de esta manera abrirá una página que contiene todo el contenido de la categoría especificada.
Paso 2: Establecer la estructura del menú
En este punto, su menú aún no está ordenado. Todo se mostrará en el orden en que se agregó. Todavía no hay una función desplegable. Así que el siguiente paso es resolver estos dos problemas.
Para hacer esto, simplemente puede arrastrar y soltar los elementos del menú donde sea que estén. Incluso puede crear subelementos de esta manera. Por ejemplo, hemos enumerado tres publicaciones de blog específicas que aparecerán en el elemento de menú más grande:
Cuando termine de personalizar la estructura del menú, guarde los cambios. También tenga en cuenta que, según el tema, es posible que deba asignar un nuevo menú a una ubicación. Las opciones relevantes se pueden encontrar en la sección Configuración del menú:
Luego puede consultar su sitio web en la interfaz para ver el menú en acción. Cualquier subelemento se mostrará como un menú desplegable:
Recuerde que los menús de navegación deberían facilitarle la navegación por su sitio. Por lo tanto, es una buena idea limitar la cantidad de elementos que agrega al menú para que no se confundan ni abarroten.
Es posible que desee saber: Cómo crear un foro de WordPress | Instalación sencilla del foro de prensa
Paso 3: Agrega CSS a tu menú
También puede agregar estilos personalizados al menú desplegable usando clases CSS. Para hacer esto, comience haciendo clic en opciones de pantalla en la parte superior del tablero:
Marque la casilla denominada Clases de CSS:
Esto le permitirá agregar CSS personalizado a su menú. También limitará cualquier estilo personalizado a los elementos a los que se aplican sus clases específicas.
Paso 4: Vista previa del menú
En este punto, su menú está casi listo. Sin embargo, puede verificarlo en el Personalizador de WordPress antes de finalizar. Esto le permite realizar cambios y ver los efectos en tiempo real. haga clic aquí Administrar con vista en vivo para ingresar al editor en vivo:
Si es necesario, puede realizar más cambios aquí, como agregar, eliminar o reordenar elementos del menú:
No necesitará una nueva pestaña para obtener una vista previa de sus cambios porque configurador muestra una vista previa en vivo de su sitio.
Paso 5: Publica tu menú
Cuando esté listo, puede activar su nuevo menú con un solo clic. Simplemente seleccione el botón Publicar:
Esto activará el menú en su sitio y permitirá que los visitantes comiencen a usarlo. También vale la pena señalar que si ha creado varios menús y desea colocarlos en varias ubicaciones, también puede usar configurador Para ello:
DE configuradorpuede asignar menús a todas las diferentes ubicaciones admitidas por su tema.
Complementos del menú desplegable
Por supuesto, si prefiere utilizar complementos para crear menús desplegables, hay varias opciones disponibles. Estos son algunos de los mejores complementos que puede usar al crear un menú desplegable en WordPress, tanto gratuitos como premium:
- Max Mega Menú: un complemento gratuito que agrega muchas opciones a su editor de menú existente.
- menú héroe: herramienta altamente personalizable con énfasis en la capacidad de respuesta.
- UberMenú: una solución que le brinda el máximo control sobre el estilo y la funcionalidad del menú.
Cualquiera de estas herramientas puede hacer el trabajo. Por lo tanto, cuál elija dependerá de sus preferencias personales y de las características específicas que esté buscando.
3 consejos rápidos para usar los menús desplegables
Ahora que sabe cómo configurar correctamente un menú desplegable de WordPress, queremos darle 3 consejos rápidos para tener en cuenta:
- Al usar la opción desplegable predeterminada de WordPress, puede organizar los lugares donde coloca el submenú. Por ejemplo, si su menú se titula «Alimento«y lo deseas»Desayuno«aparecer antes»Almuerzo”Simplemente arrastre y suelte el desayuno en la parte superior.
- ¡Al crear su menú, asígnele un título adecuado! Por ejemplo, si tiene un menú titulado «Acerca de mí», no desea que el menú desplegable incluya «Contacto» y «Preguntas frecuentes». En esta nota, sugerimos tener «contacto«,»Preguntas frecuentes«T»SOBRE«como opciones de menú separadas.
- Como regla general, no debes poner todos los huevos en una canasta. En este caso, no cree un menú e incluya todos los submenús en él.
Siempre que recuerde estos 3 consejos, cuando crea tu menú desplegable de WordPress¡Estarás listo para ir!
Mega menú: una alternativa al menú desplegable
El menú desplegable predeterminado de WordPress es excelente por sí solo, pero si está buscando un menú con un poco de decoración, permítanos presentarle el mega menú.
megamenu es otra forma de menús desplegables, solo utilizan enlaces avanzados, imágenes, cuadros de búsqueda, mapas y más. Son extremadamente fáciles de crear cuando usa complementos de mega menú dedicados, especialmente opciones como UberMenú Sí Mega Menú Pro.
Echa un vistazo a: Cómo añadir cookies a WordPress sin plugin (con y sin plugin)
pensamientos finales
Siguiendo las instrucciones paso a paso que le proporcionamos, podrá crear menús desplegables en wordpress en algunos minutos. WordPress le permite personalizar casi todo en su sitio, por lo que no hay ninguna razón por la que no deba crear submenús fáciles de usar. Especialmente porque ayudan a sus clientes a navegar por su sitio.
Es importante crear sitios web accesibles y visualmente atractivos. Una técnica simple que ayuda en ambas áreas es crear menús de navegación desplegables. Este tipo de menú es atractivo y fácil de usar, y también ahorra algo de espacio en la pantalla. Para mantener un sitio web fácil de usar, también necesita acceso a recursos adecuados y alojamiento confiable.