martes, mayo 28, 2024
No menu items!
InicioBlogsCómo crear un menú de navegación vertical en WordPress

Cómo crear un menú de navegación vertical en WordPress

¿Estás intentando crear un menú de navegación vertical en WordPress?

Los menús de navegación se pueden ver horizontal o verticalmente. Sin embargo, usar menús verticales en WordPress ofrece varios beneficios, ya que encajan mejor en la barra lateral de su sitio web y son más fáciles de navegar en dispositivos móviles.

En este artículo le mostraremos cómo crear fácilmente un menú de navegación vertical en WordPress.

Cómo crear un menú de navegación vertical en WordPress

Un menú de navegación es una lista de enlaces que apuntan a áreas importantes de un sitio web de WordPress. Este menú suele presentarse como una barra horizontal de enlaces en la parte superior de cada página.

Vista previa del menú de navegación horizontal de MonsterInsights

Los menús de navegación le dan estructura a su sitio y ayudan a los visitantes a encontrar lo que buscan. Puede agregar enlaces a sus páginas, categorías o temas principales, publicaciones de blog de WordPress e incluso agregar enlaces personalizados como su perfil de redes sociales.

Pero aunque a menudo los ves colocados horizontalmente en la parte superior de un sitio web, los menús de navegación vertical tienen muchos usos y beneficios.

Un menú de navegación vertical ocupa menos espacio en la página, es más fácil de escanear y navegar y puede colocarse en la barra lateral, en el pie de página o incluso como una ventana emergente, lo que lo hace más flexible.

Por ejemplo, si tienes una tienda online, utilizar un menú de navegación vertical te permitirá mostrar muchos más productos y categorías de productos sin ocupar demasiado espacio.

Vista previa del menú de navegación vertical

Dicho esto, veamos algunas formas de crear un menú de navegación vertical en WordPress. Estos son los temas que cubriremos en este artículo:

Cuando agrega un menú de navegación a su sitio web, se mostrará vertical u horizontalmente. Depende del tema y la ubicación del menú que seleccione.

La cantidad de ubicaciones de menú disponibles depende del tema que esté utilizando. Es posible que algunas de estas ubicaciones muestren el menú verticalmente.

Para probar esto con su tema, vaya al Apariencia » Menú página desde la barra lateral de administración de WordPress. Aquí puede experimentar para ver qué posiciones están disponibles en su sitio web y cómo aparecen.

Por ejemplo, el tema Twenty Twenty-One no ofrece posiciones verticales, mientras que el tema Twenty Twenty ofrece una llamada “Menú de escritorio ampliado”.

El tema Twenty Twenty tiene una posición de menú vertical.

Simplemente puede seleccionar el menú que desea mostrar verticalmente y luego marcar la casilla “Menú expandido de escritorio” en la parte inferior de la pantalla.

A continuación, debe asegurarse de hacer clic en el botón “Guardar menú” para almacenar su configuración. Así es como se ve en nuestro sitio web de demostración.

Vista previa de la posición del menú vertical veinte veinte

Para obtener más información sobre cómo editar menús y ubicaciones de menús, puede consultar nuestra guía para principiantes sobre cómo agregar un menú de navegación en WordPress.

No importa qué tema estés usando, es fácil agregar un menú de navegación vertical a tu barra lateral usando un widget.

Primero, deberá crear un menú de navegación que desee mostrar si aún no lo ha hecho. Entonces tienes que visitar el Apariencia » Widgets página desde su panel de WordPress.

🔥 Leer:  Cómo agregar preguntas y respuestas sobre productos en WooCommerce

Desde aquí, simplemente haga clic en el botón “+” en la esquina superior izquierda de la página y arrastre el bloque del menú de navegación a la barra lateral.

Agregar bloque de menú de navegación a la barra lateral

A continuación, puede darle un nombre al widget y seleccionar el menú que desea mostrar en el menú desplegable. Finalmente, haga clic en el botón “Actualizar” en la parte superior para almacenar su configuración.

Así es como se ve el menú de la barra lateral vertical en nuestro blog de demostración de WordPress.

Vista previa del menú de navegación vertical en la barra lateral

Puede agregar un menú de navegación vertical a publicaciones y páginas de manera similar.

Primero, debes crear una nueva publicación o editar una existente.

Luego, haga clic en el botón “+” en la parte superior de la página y luego arrastre el bloque de navegación a la página.

Agregue el bloque de navegación a su publicación o página

A continuación, elija qué menú aparecerá. Simplemente haga clic en el botón “Seleccionar menú” en la barra de herramientas y seleccione el menú deseado.

Finalmente, debes mirar la configuración del bloque en el panel derecho.

Allí encontrará dos botones para orientar el menú. Deberá hacer clic en el botón de flecha hacia abajo para orientar el menú verticalmente.

Cambiar el bloque del menú de navegación a una orientación vertical

Una vez que haya terminado, haga clic en el botón “Publicar” o “Actualizar” para almacenar su configuración.

Si utiliza un tema basado en bloques, puede agregar fácilmente el menú de navegación vertical a su sitio utilizando el editor de sitio completo.

Para hacer esto, vaya a Apariencia » Editor pantalla desde su panel de WordPress. Una vez que estés en el editor, continúa y haz clic en el menú de navegación que aparece en la parte superior del encabezado del sitio web.

A continuación, haga clic en el botón “Seleccionar navegación” en la barra de herramientas.

Haga clic en el menú

Ahora verá varias opciones para personalizar el menú de navegación en el panel derecho.

Una de estas opciones es si mostrar el menú en orientación horizontal o vertical. Simplemente haga clic en la flecha hacia abajo para obtener orientación vertical y crear un menú vertical.

Haga clic en la flecha hacia abajo para orientación vertical para crear un menú vertical

Para obtener más información, consulte nuestra guía sobre cómo agregar un menú de navegación en WordPress.

Finalmente, haga clic en el botón “Guardar” para almacenar su configuración. Ahora ha agregado un menú de navegación vertical a su sitio.

SemillaProd es el mejor creador de páginas de WordPress y complemento de creación de temas personalizados del mercado. Le permite crear fácilmente menús verticales en cualquier lugar de su sitio web de WordPress.

Primero necesitas instalar y activar el archivo. SemillaProd conectar. Para obtener más detalles, consulte nuestra guía para principiantes sobre cómo instalar un complemento de WordPress.

Al activar, debe ingresar su clave de licencia. Puede encontrar esta información en su cuenta en el sitio web de SeedProd.

Clave de licencia de SeedProd

A continuación, puede utilizar SeedProd para crear un tema personalizado de WordPress.

🔥 Leer:  ¿Cómo puedo descargar fuentes para Windows 10?

Crear un tema personalizado de WordPress

Encontrarás el generador de temas de SeedProd accediendo al archivo SeedProd » Creador de temas página. Aquí utilizará uno de los temas ya preparados de SeedProd como punto de partida. Esto reemplazará su tema de WordPress existente con un nuevo diseño personalizado.

Puede hacerlo haciendo clic en el botón “Temas”.

Crea tu propio tema personalizado

Luego se le mostrará una lista de temas diseñados profesionalmente para diferentes tipos de sitios web. Por ejemplo, hay plantillas llamadas “Negocios modernos”, “Agencia de marketing” y “Tema de corredor hipotecario”.

Echa un vistazo a las opciones y selecciona la que mejor se adapte a tus necesidades haciendo clic en el icono de marca de verificación.

Seleccione un tema que se adapte a sus necesidades

Una vez que elija un tema, SeedProd generará todas las plantillas de temas que necesita. Puede aprender cómo personalizar estas plantillas en nuestra guía sobre cómo crear fácilmente un tema personalizado de WordPress.

Agregar un menú de navegación vertical a las plantillas de su sitio

Ahora puede usar SeedProd para agregar un menú de navegación vertical a cualquier plantilla de tema. En este tutorial, agregaremos un menú a la plantilla de índice del blog.

Debe colocar el mouse sobre esa plantilla y luego hacer clic en el enlace “Editar diseño”.

Haga clic en el enlace Editar dibujo

Esto abrirá el creador de páginas de arrastrar y soltar de SeedProd, donde verá una vista previa de su sitio web a la derecha y un panel de bloques a la izquierda.

Desde aquí, desplácese por los bloques hasta llegar a la sección Avanzado.

Una vez que ubique el bloque del Menú de navegación, arrástrelo a la barra lateral o donde desee que aparezca el menú de navegación. De forma predeterminada, sólo hay un elemento en el menú, “Acerca de”.

Arrastre el bloque del menú de navegación a la página

Ahora necesitarás cambiar la configuración del menú. Para ello pulsa sobre el menú y en la columna de la izquierda aparecerán las opciones disponibles.

El tipo de menú 'Simple' está actualmente seleccionado. Esto le permite crear su propio menú de navegación en SeedProd.

Sin embargo, para este tutorial, haremos clic en el tipo “Menú de WordPress” para usar el menú de navegación de WordPress.

Haga clic en la opción del menú de WordPress

Finalmente, debe hacer clic en la pestaña “Avanzado”. Aquí encontrará una opción para orientar el diseño de la lista vertical u horizontalmente.

Cuando haces clic en el botón “Vertical”, notarás que la vista previa se convierte inmediatamente en un menú de navegación vertical.

Haga clic en la opción vertical

No olvide hacer clic en el botón “Guardar” en la parte superior de la pantalla para almacenar su menú vertical.

Puede resultar difícil tocar un menú estándar mientras se utiliza la pequeña pantalla de un teléfono inteligente. Es por eso que recomendamos obtener una vista previa de la versión móvil de su sitio de WordPress para ver cómo se ve su sitio web en dispositivos móviles.

Los menús verticales son mucho más fáciles de navegar, especialmente cuando se utiliza un menú responsivo de pantalla completa que se adaptará automáticamente a diferentes tamaños de pantalla.

🔥 Leer:  La referencia no es válida Error de Excel
Vista previa del menú en pantalla completa

Para aprender cómo hacer que su menú de navegación sea más fácil de usar en dispositivos móviles, consulte nuestra guía sobre cómo agregar un menú responsivo de pantalla completa en WordPress.

Aparece un menú desplegable como un menú de navegación horizontal normal en la parte superior de la pantalla. Pero cuando pasas el cursor sobre uno de los elementos, aparece un submenú vertical.

Si tiene un sitio web con mucho contenido, un menú desplegable le permite organizar la estructura del menú por tema o jerarquía. Esto mostrará más contenido en un espacio limitado.

Vista previa de un menú desplegable

Para mostrar un menú de navegación desplegable en su sitio web, deberá elegir un tema que admita menú desplegable. A continuación, debe crear el menú de navegación y luego agregar subelementos a algunos elementos del menú.

Puedes aprender cómo hacer esto paso a paso en nuestra guía para principiantes sobre cómo crear un menú desplegable en WordPress.

Un mega menú enumera varios menús verticalmente en la página. Son similares a los menús desplegables, excepto que todos los submenús aparecen a la vez, lo que permite a los usuarios encontrar rápida y fácilmente el mejor contenido.

Los mega menús son muy atractivos e interactivos porque combinan lo mejor de los menús horizontales y verticales para mostrar una descripción general útil del contenido de su sitio web en una sola pantalla.

Recientemente agregamos un mega menú a WPBeginner para mejorar la visibilidad del contenido. Explicamos cómo lo hicimos en nuestra mirada detrás de escena del diseño de nuestro nuevo sitio.

Megamenú de WordPress para principiantes

Puede obtener más información en nuestra guía sobre cómo agregar un mega menú a su sitio de WordPress.

Bonificación: cree un menú de navegación flotante adhesivo en WordPress

También puede crear un menú de navegación flotante permanente para su sitio web para mejorar la participación del usuario. Un menú persistente permanece visible en la pantalla incluso cuando los usuarios se desplazan hacia abajo en la página, lo que facilita el acceso.

Para que el menú de navegación sea permanente, debe instalar y activar el archivo Menú fijo y encabezado fijo. conectar. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

Después de la activación, vaya a Ajustes » Menú permanente página y escriba #main-navigation junto a la opción “Elemento de etiqueta (obligatorio)”. De esta manera, incluso puedes hacer que el menú de navegación vertical sea permanente.

Escriba el menú de navegación como elemento permanente

Una vez que haya terminado, haga clic en “Guardar cambios” para almacenar su configuración. Para obtener más instrucciones, puede consultar nuestro tutorial sobre cómo crear un menú de navegación flotante adhesivo en WordPress.

Esperamos que este tutorial te haya ayudado a aprender cómo crear un menú de navegación vertical en WordPress. Quizás también quieras aprender cómo iniciar tu propio podcast o consultar nuestra comparación de expertos de los mejores registradores de dominios.

Recomendamos

Populares