Sitio web de Wix desde cero - Grid Gallery

• Mayo 6, 2024

En este tutorial, agregaremos una galería a nuestro sitio web Wix, que hemos creado a partir de una plantilla en blanco. Comenzar desde cero es una excelente manera de aprender lo básico.

A diferencia de las plantillas de Wix que no son intercambiables, puede cambiar los tipos de galería para una nueva apariencia en cualquier momento. Hay muchos tipos de galerías, desde la cuadrícula de mampostería hasta el nido de abeja. Cada galería tiene sus propias características. Echemos un vistazo a la galería básica de Cuadrícula (retrato).

1. Haga clic en el ícono Más en el menú de la izquierda y elija Galería de la lista.
   
   
2. Desplácese sobre cada miniatura de la galería para ver una vista previa y una descripción.
   
   
3. Ahora, arrastre la galería de Cuadrícula a la página.
   
   
4. Use las manijas de cambio de tamaño para cambiar el tamaño de la cuadrícula como desee. Cambié el tamaño de la cuadrícula al ancho de la página 980.
   
   En este punto, la galería tiene algunas imágenes de marcador de posición. Conservemos por ahora y trabajemos en personalizar la configuración de la galería para nuestras necesidades.
   
   Configuración de la galería de cuadrículas
   
   Escalado de imagen: tiene la opción de recortar o escalar su imagen para que se ajuste al marco. La configuración de Recorte automático recortará automáticamente las imágenes para que se ajusten al marco y la opción Ajustar cambiará el tamaño de la imagen para que se ajuste al marco.
   
   Al hacer clic: tiene tres opciones para lo que sucede cuando se hace clic en una imagen de la galería. Una opción para que nada suceda. El segundo es tener la imagen abierta como una ventana emergente. El tercero es abrir un enlace. La mayoría de las veces, la ventana emergente es una buena opción porque la imagen se muestra en un tamaño más grande. Pero si desea enviar al visitante a otra página, use la opción A Link Opens.
   
   
5. Seleccione la Galería y haga clic en el icono de Configuración en el menú emergente.
   
   
6. En la ventana Configuración de cuadrícula, busque la sección Cómo se comportan las imágenes. Elija Autocrop o Fit.
   
   
7. En la sección Al hacer clic, configure una de las tres opciones.
   
   Diseño de galerías
   
   Como se mencionó anteriormente, puede cambiar los diseños de la galería en cualquier momento. Pero continuemos personalizando nuestro diseño de cuadrícula. Para el diseño de la cuadrícula, podemos personalizar el borde, las esquinas, la sombra y el texto.
   
   
8. Con la galería aún seleccionada, haga clic en el icono Diseño (pincel).
   
   
9. Para la configuración del borde, podemos cambiar el color, la opacidad y el ancho del borde. Mantenga la configuración predeterminada del ancho establecida en 0 y, por lo tanto, sin borde.
   
   
10. Radio de la esquina: haga clic en el icono del Radio de la esquina y configure el radio de la esquina superior izquierda como desee. Como el ícono del enlace indica, las otras tres esquinas se actualizarán para coincidir.
    
    
11. Sombra: seleccione el icono Sombra. Para agregar una sombra paralela, haga clic en Activar alternar sombra y configure el Ángulo, Distancia, Tamaño, Desenfoque y Color / Opacidad para la sombra.
    
    
12. Texto: haga clic en el ícono T para establecer las opciones para el Título, Descripción y Otras configuraciones de texto. Cambiemos el texto por defecto a nuestro tema de texto del párrafo 1. Repita para el texto de Descripción.
    
    opciones de diseño
    
    Para el diseño de la galería de cuadrículas, podemos controlar el número de columnas y filas para las miniaturas. También podemos controlar el espacio entre las miniaturas y cómo se muestra el texto sobre la imagen.
    
    
13. Con la galería aún seleccionada, haga clic en el icono Diseño en el menú emergente.
    
    
14. Use el control deslizante para establecer el número de columnas y filas. Agregar más columnas y filas dará como resultado imágenes en miniatura más pequeñas en la cuadrícula.
    
    
15. Puede usar el control deslizante Espaciado para aumentar la cantidad de píxeles entre las miniaturas. Agregar más espacio reducirá el tamaño de las miniaturas.
    
    
16. Debajo de los controles deslizantes está la sección de alineación de texto. Tiene la opción de que el texto se muestre a la izquierda, a la derecha o al centro.
    
    

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

Instrucciones De Vídeo: Introducing Editor X | Wix.com | Editor X (Mayo 2024).