Centro de Ayuda Wix
    Inicio
  1. Wix Studio, Partners y Enterprise
  2. Wix Studio
  3. Usar el Editor de Wix Studio
  4. Agregar elementos en el Editor de Wix Studio
    5. Editor de Wix Studio: agregar y personalizar un megamenú

Editor de Wix Studio: agregar y personalizar un megamenú

5 min de lectura
Los megamenús son contenedores que puedes agregar a un menú horizontal. Cuando los visitantes pasan el cursor sobre el elemento del menú correspondiente, se abre el contenedor. Diseña el contenedor desde cero y decide para qué quieres usarlo: navegación de varios niveles, mostrar productos destacados o para cualquier otro propósito.
Ejemplo de un megamenú al estilo de eCommerce, donde el contenedor muestra muchos enlaces de navegación a diferentes categorías de productos
Debes saber lo siguiente:
Solo es posible agregar un contenedor de megamenú a un menú horizontal. Los contenedores de megamenú no son compatibles con los menús verticales, los menús de anclas ni los menús tipo hamburguesa.
En este artículo, aprenderás a hacer lo siguiente:

Agregar y configurar un contenedor para el megamenú

Agrega el contenedor del megamenú como un ítem a un menú existente y asígnale el nombre que quieras. Recomendamos usar un título que refleje el contenido previsto, como "Servicios" o "Nuestra historia".
Una vez que hayas agregado y nombrado tu contenedor, agrégale elementos como botones, formas y texto para crear el contenido que deseas. 

Para agregar un megamenú:

  1. Selecciona el menú horizontal correspondiente en el editor.
  2. Haz clic en Administrar menú.
  3. Haz clic en + Agregar ítem en la parte inferior del panel.
  4. Selecciona Megamenú.
  5. Ingresa un título para el megamenú.
    Consejo: Este es el título sobre el que los visitantes pasan el cursor para ver el megamenú.
  6. Haz clic en Listo.
  7. Agrega contenido al megamenú:
    1. (En el panel Administrar menú) Haz clic en Editar junto a Contenedor.
    2. Agrega los elementos que necesites al contenedor.
El panel Administrar menú; hacer clic en Editar para comenzar a agregar elementos a un nuevo contenedor de megamenú

Crear un menú desplegable

Usa un megamenú para organizar ítems específicos en un sitio al crear un menú desplegable. Cuando los visitantes hacen clic en el megamenú, el menú desplegable y sus elementos aparecen en el contenedor. 
Se ha abierto un menú desplegable en un sitio online de Wix.
Cosas que debes saber:
Los ítems del menú desplegable se agregan y se administran desde el mismo panel que el menú principal, por lo que es aún más fácil configurar la navegación por el sitio.

Para crear un menú desplegable:

  1. Selecciona el menú horizontal correspondiente en el editor.
  2. Haz clic en Administrar menú.
  3. (Si el ítem no se ha agregado al menú horizontal) Haz clic en Agregar ítem y configura el ítem del menú que deseas.
  4. Anida los ítems del menú correspondientes debajo del megamenú: 
    1. Selecciona el ítem en el panel Administrar menú.
    2. Arrastra y suelta el ítem debajo del megamenú.
GIF que muestra ítems que se arrastran y sueltan en un megamenú desde el panel de administrar menú, lo que crea un menú desplegable.
¿Quieres administrar los ítems del menú desplegable?
Usa el panel Administrar menú para reordenar, renombrar y eliminar ítems en un menú desplegable.

Ajustar el estilo del contenedor del megamenú

Después de agregar los elementos que deseas al megamenú, cambia el estilo para que coincida con la estructura de tu página. Puedes ajustar el espaciado y decidir cuánto se estira el contenedor. 

Para cambiar el estilo:

  1. Selecciona el menú correspondiente en el editor.
  2. Haz clic en el icono Estilo .
  3. Haz clic en Megamenú.
  4. Usa las opciones para ajustar el estilo:
    • Estirar contenedor: decide si el contenedor se estira o no al ancho total de la pantalla del visitante. Cuando la palanca está desactivada, puedes establecer el ancho deseado en el lienzo o en el panel Inspector profesional.
    • Márgenes: agrega espacio (en px o %) entre el contenedor del megamenú y los bordes de la pantalla.
    • Espacio entre ítems y contenedor: haz que el espacio entre el menú y el contenedor del megamenú sea más grande o más pequeño arrastrando el control deslizante.
La pestaña del megamenú en el panel de estilo del menú en el Editor de Wix Studio.

Diseñar el megamenú

Una vez que hayas ajustado el estilo del contenedor, diseña los bordes, el fondo y más. Para mantener un aspecto uniforme, los cambios que realices en el megamenú también se aplican a cualquier submenú que hayas agregado.

Para personalizar el diseño del contenedor:

  1. Selecciona el menú correspondiente en el editor.
  2. Haz clic en el icono Abrir Inspector profesional  en la parte superior derecha del editor.
Captura de pantalla de la apertura del panel Inspector profesional en el Editor de Wix Studio.
  1. Selecciona Contenedor de submenú en el menú desplegable ¿Qué quieres diseñar?
  2. Usa las opciones disponibles para diseñar el contenedor:
    • Relleno de fondo: establece un color, un degradado o un fondo de imagen para el contenedor. Puedes agregar varias capas de fondo con diferentes niveles de opacidad. 
    • Bordes: agrega y diseña los bordes del contenedor.
    • Esquinas: haz que las esquinas del contenedor sean más redondeadas o más angulosas. 
    • Sombreado: agrega una sombra detrás del contenedor para obtener un efecto 3D.
Las selecciones para diseñar el contenedor del submenú en el panel Inspector profesional, que muestra las opciones disponibles para los megamenús

¿Te ha sido útil?

|
En este artículo
  • Agregar y configurar un contenedor para el megamenú
  • Crear un menú desplegable
  • Ajustar el estilo del contenedor del megamenú
  • Diseñar el megamenú