Wix Website from Scratch - El menú del encabezado

• Abril 27, 2024

En este tutorial, continuaremos trabajando en nuestro sitio web Wix que comenzamos desde una plantilla en blanco. Agregaremos un menú principal en la sección de encabezado.

Nuestra primera tarea es agregar un fondo de color al Encabezado.

1. Seleccione el encabezado y haga clic en el botón Cambiar diseño de encabezado.
   
   En este punto, el encabezado se establece en Sin color. Cambiemos eso a blanco.
   
   
2. Haga clic en el diseño del encabezado justo debajo de Sin color.
   
   
3. Haga clic en el botón Personalizar diseño en la parte inferior de la ventana.
   
   
4. Establezca el color de relleno y la opacidad en 100% blanco para el fondo y el fondo central.
   
   
5. Para la configuración del borde, establezca el borde superior y el ancho del borde inferior en 0.
   
   
6. Establezca el Radio de las esquinas en 0 y desactive Habilitar sombra.
   
   

Ahora podemos agregar el menú superior.

1. En el menú de la izquierda, haga clic en el ícono Más y elija Menú de la lista.
   
   
2. Haga clic en uno de los menús horizontales para agregarlo a la página.
   
   Verá un nuevo menú en la página con el enlace de nuestra página: Inicio.
   
   
3. Haga clic y arrastre el menú a la sección del encabezado. Cuando veas el texto Adjuntar al encabezado, suelte el menú.
   
   Debido a que centraremos nuestro menú en la página, ampliaremos el cuadro de menú a lo ancho de 980 px.
   
   
4. Con el cuadro de menú seleccionado, arrastre los extremos del cuadro para llenar el área 980. Use las pautas izquierda y derecha como guía.
   
   El menú ya debería estar configurado como centro por defecto. Puede ver esto porque el enlace Inicio está en el centro del cuadro. Ahora podemos personalizar el menú.
   
   
5. Con el menú aún seleccionado, haga clic en el icono Diseño (pincel) para abrir la ventana Diseño de menú horizontal. Haga clic en el botón Personalizar diseño en la parte inferior de la ventana.
   
   Si hace clic en Color de relleno y opacidad, verá que el fondo del menú ya está configurado en 100% blanco. Mantengamos esta configuración y pasemos al texto.
   
   En el tutorial anterior, configuramos la fuente en Futura Light para el tema de texto principal. Hagamos lo mismo para el menú.
   
   
6. Haga clic en el ícono T para abrir la sección Configuración de texto.
   
   
7. Haga clic en la flecha a la derecha de la sección Fuente y elija Futura Light de la lista.
   
   Mantengamos la configuración de color predeterminada para el texto del menú Regular. Pero cambiaremos el color del texto del menú Hover y Clicked a dorado.
   
   
8. Haga clic en el enlace Desplazar en la ventana. Haga clic en el cuadro de color para abrir el Selector de color. Haga clic en el enlace Agregar color, cambie la configuración de Color a # bc9b5d y haga clic en el botón Agregar. Cierre el selector de color.
   
   
9. Repita el paso anterior para la configuración de clic. Pero esta vez, puede elegir el color dorado en el área Mis colores.
   
   Finalmente, queremos cambiar el texto predeterminado para el enlace de la página de INICIO al nombre del sitio web.
   
   
10. Con el menú aún seleccionado, haga clic en el botón Administrar menú en el menú emergente.
    
    
11. En el menú Páginas, busque la página INICIO y haga clic en el enlace a la derecha. Elija Cambiar nombre de la lista. Agregue el nuevo título del enlace y haga clic en Listo.
    
    Nuestra siguiente tarea es cambiar el tamaño de la sección del encabezado a un poco más que la altura del menú.
    
    
12. Seleccione el menú y arrástrelo hacia arriba a la parte superior del área del encabezado.
    
    
13. Haga clic en un área vacía del encabezado para ver el controlador Estirar. Arrastre el asa hacia arriba.
    
    

Capturas de pantalla utilizadas con permiso de Wix.com, Inc.

Instrucciones De Vídeo: Crear header o cabecera con WIX (Abril 2024).