Editor de Wix: crear un menú emergente de pantalla completa

Usa el elemento de ventana interactiva para crear un impactante menú emergente de pantalla completa. Cuando los visitantes hacen clic en el botón "Menú", se abre en la parte superior del contenido del sitio, como en el siguiente ejemplo:
 

Paso 1 | Agrega una ventana interactiva al sitio

Comienza agregando cualquier ventana interactiva desde el panel Agregar al sitio. Lo rediseñarás más tarde. 

Para agregar una ventana interactiva:

  1. Haz clic en Agregar en el lado izquierdo del Editor.
  2. Haz clic en Interactivo.
  3. Selecciona una ventana interactiva.
                   

Paso 2 | Configura el menú de tu ventana interactiva

Después de agregar una ventana interactiva, configúrala para que no se muestre automáticamente cada vez que los visitantes accedan al sitio. Luego, diseña la ventana a tu gusto y agrega un menú vertical. 

Para configurar la ventana interactiva:

  1. Haz clic en la ventana interactiva y haz clic en el icono Opciones .
    1. Cambia el nombre de la ventana interactiva a algo reconocible como "menú de página completa".
    2. Selecciona No en Mostrar automáticamente.
                                           
  1. Elimina todos los elementos dentro de la ventana interactiva. No elimines el icono 'X'.
  2. Agrega un menú vertical a la ventana interactiva.
  3. Diseña el menú. Recomendamos que las fuentes del menú sean grandes y centradas.
  4. Cuando estés listo, haz clic en Salir del modo en la parte superior.
            
Consejo::
También puedes personalizar el fondo de la ventana interactiva y la superposición de fondo para que coincida con el sitio. Haz que los fondos sean ligeramente transparentes para un efecto genial.

Paso 3 | Agrega un botón para abrir el menú

Ahora que la ventana interactiva y el menú están listos, agrega el botón en el que los visitantes hacen clic para acceder al menú. Luego, enlaza el botón a la ventana interactiva. 

Para agregar un botón:

  1. Haz clic en Agregar en el lado izquierdo del Editor.
  2. Haz clic en Decorativo.
  3. Haz clic en Formas más básicas.
  4. Escribe "menú" en la barra de búsqueda y pulsa Enter.
  5. Selecciona un diseño y haz clic en Agregar a la página.
    Consejo: Coloca el botón de menú en un lugar destacado del sitio, como el encabezado.
  6. (Opcional) Haz clic en el icono Diseño para diseñar el botón de menú.
  7. Haz clic en el botón de menú y haz clic en el icono Enlace .
  8. Selecciona Ventanas a la izquierda.
  9. Elige tu ventana interactiva en el menú desplegable y haz clic en Hecho.
Consejos:
  • Coloca el botón del menú en un lugar destacado del sitio. Podría estar en el encabezado, o tal vez quieras usar la función Fijar a la pantalla para fijarlo en la parte superior del sitio. Si el botón de menú no está ubicado en el encabezado, asegúrate de configurarlo para que se muestre en todas las páginas.
  • También puedes diseñar tu propio botón de menú. Puede ser un botón de texto, un botón de icono o una forma diferente; ¡depende de ti! Mira algunos ejemplos a continuación:

Paso 4 | Oculta el botón del sitio móvil

Oculta el botón que acabas de crear del sitio móvil, que ya tiene un menú de pantalla completa preestablecido. 

Para ocultar el botón:

  1. Accede al Editor móvil.
  2. Haz clic en el botón de menú que está vinculado a la ventana interactiva y haz clic en el icono Ocultar
                                                            

¿Te ha sido útil?

|