Editor de Wix Studio: agregar y administrar nuevos menús

8 min de lectura
En este artículo
  • Agregar un menú
  • Administrar los ítems del menú
  • Crear menús desplegables
  • Cambiar el menú a un estilo diferente
  • Mostrar varios menús en el mismo sitio
Agrega nuestro nuevo elemento de menú para agilizar el proceso de creación del sitio y, al mismo tiempo, mejorar la navegación para los visitantes de tu cliente. Elige el mejor estilo para cada breakpoint: horizontal, vertical o menú tipo hamburguesa. Cambiar de estilo es muy sencillo, por lo que puedes realizar ajustes sobre la marcha a medida que evoluciona el diseño del sitio.
Administra los ítems del menú según sea necesario agregando, eliminando y reordenando los ítems. Puedes usar los contenedores desplegables para mostrar submenús con tu propio contenido, lo que te permite crear una experiencia personalizada que se adapte a las necesidades de tu cliente.
Importante:
Este artículo hace referencia al nuevo elemento de menú en el Editor de Wix Studio, que aún no está disponible para todos los usuarios. Para conocer los pasos sobre cómo agregar y administrar los menús anteriores, haz clic aquí.

Agregar un menú

Para comenzar, agrega un menú al sitio. Recomendamos agregar un menú al encabezado del sitio, pero puedes agregar y configurar tantos menús como necesites para adaptar la experiencia a las diferentes páginas y secciones.
Una vez que agregues el menú, elige los ítems que deseas que se muestren (por ejemplo, páginas del sitio, enlaces, etc.).

Para agregar un menú:

  1. Haz clic en Agregar elementos  a la izquierda del editor.
  2. Selecciona Menú y búsqueda
  3. Selecciona el tipo de menú que deseas (Horizontal, Vertical o Tipo hamburguesa). 
  4. Haz clic en el menú y arrástralo a la posición deseada en la página.
  5. Agrega ítems al nuevo menú:
    1. Selecciona el menú que acabas de agregar. 
    2. Haz clic en Administrar menú.
    3. Haz clic en + Agregar ítem en la parte inferior.
    4. Selecciona el ítem que deseas agregar: 
      • Páginas principales: agrega al menú una página normal del sitio.
      • Páginas dinámicas y de apps: agrega páginas de apps (por ejemplo, una página de producto de Wix Stores) o páginas conectadas a colecciones en el CMS.
      • Enlace: puedes agregar muchos tipos de enlaces al menú, como enlaces a otros sitios web, a anclas en las páginas del sitio, a los datos de contacto de tu cliente, etc. 
      • Menú desplegable: agrega un contenedor que aparece debajo del menú cuando los visitantes pasan el cursor sobre el ítem. Puedes diseñarlo según sea necesario y usarlo para mostrar elementos del menú y contenido adicional. 
¿Cambiaste de opinión sobre el estilo (tipo) del menú?
No te preocupes, siempre puedes cambiarlo más tarde.
El panel para agregar elementos está abierto. El cursor está agregando un menú horizontal al sitio.

Administrar los ítems del menú

Siempre puedes ajustar un menú existente y los elementos que muestra. Agrega más ítems, elimina los que sean irrelevantes o cambia el orden para mantener el contenido actualizado. 

Para administrar un menú:

  1. Selecciona el menú correspondiente en el editor. 
  2. Haz clic en Administrar menú.
  3. Elige qué hacer a continuación:
El panel para administrar el menú está abierto. El cursor hace clic para cambiar el nombre de un ítem.

Crear menús desplegables

Hay 2 formas de crear menús desplegables en un menú, según cómo quieras que sea el título:
  • Un ítem del menú existente: elige un ítem existente (página o enlace) del menú para mostrar el menú desplegable cuando los visitantes pasen el cursor sobre él. 
  • Un título en el que no se puede hacer clic: agrega un título desplegable que no conduce a ninguna página. Cuando los visitantes pasan el cursor sobre él, se abre el contenedor desplegable. 

Para agregar y configurar un menú desplegable:

  1. Selecciona el menú correspondiente en el editor.
  2. Haz clic en Administrar menú.
  3. Elige lo que quieres hacer:
    • Usa un ítem del menú existente:
      1. Arrastra un elemento del menú para moverlo debajo del elemento que deseas como título del menú desplegable.
      2. Pasa el cursor sobre el mismo ítem y haz clic en el icono Más acciones
      3. Selecciona Mover a "Nombre de la página".
      4. Repite los pasos a - c para todos los demás ítems.
    • Crea un nuevo menú desplegable:
      1. Haz clic en + Agregar ítem.
      2. Selecciona Menú desplegable.
      3. Ingresa el título del menú desplegable. 
      4. Pulsa la tecla Enter en el teclado para guardar los cambios.
      5. Arrastra y suelta los elementos del menú debajo del menú desplegable para agregarlos.
      6. Repite el paso e para todos los demás ítems que desees agregar.
Se ha creado un menú desplegable en el panel para administrar el menú. Se está arrastrando un elemento del menú debajo de él.

Cambiar el menú a un estilo diferente

Usa los ajustes de estilo para elegir el tipo de menú que deseas: una barra de navegación horizontal o vertical, o un menú tipo hamburguesa.

Para establecer el estilo:

  1. Haz clic en el menú desde el editor.
  2. Haz clic estilon el icono Estilo .
  3. Selecciona el tipo de menú:
    • Barra de navegación: los elementos del menú se muestran en una barra. En Orientación, elige si la barra es horizontal o vertical.
    • Menú hamburguesa: se muestra un icono. Cuando los visitantes del sitio hacen clic en el icono, se abre el menú.
El panel de estilo del menú. El cursor ha seleccionado la barra de navegación.

Mostrar varios menús en el mismo sitio

Puedes crear tantos menús como necesites y mostrar ítems completamente diferentes en cada uno de ellos. 
Después de agregar un nuevo elemento de menú, puedes elegir qué menú debe mostrar: un menú existente que guardaste o uno nuevo que puedes crear en el acto. Esto significa que puedes guardar los menús y reutilizarlos en diversos elementos de menú en todo el sitio. 
¿Estás mostrando el mismo ítem en varios menús?
Puedes darle al ítem un nombre único en cada menú para que siempre coincida con la intención específica. Todos los menús que crees son completamente independientes entre sí.
Haz clic a continuación para aprender a hacer lo siguiente: