Galería Wix Pro: diseñar tu galería
10 min
Haz que tu galería se destaque en tu sitio agregando algunas personalizaciones de diseño. Puedes darle a tu galería un toque profesional personalizando el estilo, los colores, las fuentes y mucho más.
Para personalizar el diseño de tu Galería Wix Pro:
- Ve al editor.
- Haz clic en el elemento galería Wix Pro en la página.
- Haz clic en Ajustes.
- Haz clic en la pestaña Diseño.
- Elige lo que quieres personalizar:
Superposición e iconos
Una superposición se coloca encima de una imagen y agrega un efecto adicional cuando pasas el cursor sobre la imagen. Puedes personalizar este efecto, así como cualquier ícono que tengas.
- Haz clic en Superposición e iconos.
- Elige entre una superposición total o parcial y personalízala con las opciones disponibles:
- Superposición total: la superposición cubre todo el elemento de la galería.
- Degradado: desliza la palanca para habilitar un degradado superpuesto.
- Color y opacidad 1 y 2: selecciona el cuadro de color correspondiente para personalizar los colores del degradado. Luego, arrastra el control deslizante para ajustar la opacidad de los colores.
- Dirección del degradado: arrastra el control deslizante para ajustar la dirección del degradado superpuesto.
- Color del icono: haz clic en el cuadro de color para cambiar el color de los iconos de la galería que aparecen al pasar el cursor.
- Color de transparencia: haz clic en el cuadro de color para elegir un color. Luego, arrastra el control deslizante para cambiar la transparencia de la superposición de color.
- Color del icono: haz clic en el cuadro de color y selecciona un nuevo color para los iconos de la galería.
- Degradado: desliza la palanca para habilitar un degradado superpuesto.
- Superposición parcial: la superposición cubre solo una parte del elemento de la galería.
- Configurar tamaño en: administra el tamaño de la superposición en porcentajes o píxeles.
- Tamaño: arrastra el control deslizante o ingresa un valor para elegir un tamaño de superposición.
- La superposición comienza desde: elige dónde se coloca la superposición.
- Relleno: arrastra el control deslizante para ajustar la cantidad de espacio entre el borde de la galería y la superposición.
- Degradado: desliza la palanca para habilitar un degradado superpuesto.
- Color y opacidad 1 y 2: selecciona el cuadro de color correspondiente para personalizar los colores del degradado. Luego, arrastra el control deslizante para ajustar la opacidad de los colores.
- Dirección del degradado: arrastra el control deslizante para ajustar la dirección del degradado superpuesto.
- Color del icono: haz clic en el cuadro de color para cambiar el color de los iconos de la galería que aparecen al pasar el cursor.
- Color de transparencia: haz clic en el cuadro de color para elegir un color. Luego, arrastra el control deslizante para cambiar la transparencia de la superposición de color.
- Color del icono: haz clic en el cuadro de color y selecciona un nuevo color para los iconos de la galería.
- Superposición total: la superposición cubre todo el elemento de la galería.
- Elige un efecto de superposición entre las opciones disponibles:
- No hay efecto: la superposición no aplica ningún efecto.
- Fundido: la superposición aparece gradualmente al pasar el cursor.
- Expandir: la superposición se expande al pasar el cursor.
- Deslizar hacia arriba: la superposición se desliza hacia arriba al pasar el cursor.
- Deslizar a la derecha: la superposición se desliza al pasar el cursor.
Textos
Puedes personalizar el diseño del título y el texto de la descripción, siempre que elijas mostrarlos en la pestaña Diseño . Si no ves las opciones de Texto (paso 1 a continuación), ve a la pestaña Diseño, haz clic en Personalizar estilo y selecciona las casillas de verificación junto a Título y Descripción para mostrarlas.
- Haz clic en Textos.
- Personaliza el texto usando las siguientes opciones:
- Información a mostrar: selecciona la casilla de verificación junto a la información que deseas mostrar (título, descripción, contador de diapositivas).
Nota: La opción Contador de diapositivas solo está disponible en el estilo Presentación de diapositivas si has habilitado las diapositivas automáticamente.
- Estilo y color del título: selecciona la fuente y el color del texto del título.
- Estilo y color de la fuente de la descripción: selecciona la fuente y el color del texto de la descripción.
- Alineación horizontal: elige la alineación del texto horizontal a la izquierda, en el centro o a la derecha.
- Alineación vertical: elige la alineación del texto vertical a la izquierda, en el centro o a la derecha.
- Relleno de texto vertical: desliza la barra para cambiar el espacio entre el texto vertical y el borde.
- Relleno del texto horizontal: arrastra el control deslizante para modificar el espacio entre el texto horizontal y el borde.
- Información a mostrar: selecciona la casilla de verificación junto a la información que deseas mostrar (título, descripción, contador de diapositivas).
Botones
Esta sección aparecerá si eliges mostrar el botón Cargar más en la pestaña Estilo.
Aquí puedes cambiar el texto, la fuente, el color y el radio del borde del botón Cargar más.
Aquí puedes cambiar el texto, la fuente, el color y el radio del borde del botón Cargar más.
- Haz clic en Botones.
- Personaliza los botones utilizando las siguientes opciones:
- Texto del botón: ingresa el texto que aparece en el botón.
- Estilo y color de fuente: selecciona la fuente y el color del botón.
- Color y opacidad del botón: desliza la barra para cambiar el color y la opacidad del botón y haz clic en el cuadro de color para seleccionar un color.
- Ancho y color del borde: desliza la barra para cambiar el ancho del borde y haz clic en el cuadro de color para seleccionar un color.
- Radio de la esquina: arrastra el control deslizante para cambiar el radio de la esquina.
Flechas de navegación
Puedes habilitar las flechas de navegación en los estilos Miniaturas, Diapositivas, Tipo cinta y Columna. Puedes personalizar su posición, tamaño y color para ayudar a los visitantes de tu sitio a navegar por la galería con facilidad.
- Haz clic en Flechas de navegación.
- Haz clic en la palanca para habilitar las flechas en tu galería.
- Personaliza las flechas con las siguientes opciones:
- Elige un estilo de flecha: haz clic para seleccionar un diseño de flecha o haz clic en el icono Agregar
para subir el tuyo. - Fondo de flecha: haz clic en el menú desplegable para seleccionar una sombra, un cuadro o sin fondo.
- Sombra: agrega una ligera sombra alrededor de la flecha.
- Caja: agrega una caja alrededor de la flecha. Haz clic en el cuadro de color para cambiar el color del cuadro y arrastra los controles deslizantes correspondientes para ajustar su transparencia y redondear sus esquinas.
- Ninguno: no se agrega ningún fondo a la flecha.
- Tamaño de la flecha: arrastra el control deslizante para aumentar o disminuir el tamaño de las flechas de navegación.
- Color de la flecha: haz clic en el cuadro de color para seleccionar el color de la flecha de navegación. Selecciona un color de los colores de tu sitio o elige el tuyo propio.
- Posición de la flecha: selecciona la casilla de verificación correspondiente para mostrar las flechas de navegación dentro o fuera de la galería. Nota: Mostrar flechas de navegación en tu galería puede cubrir parte de los elementos de la galería.
- Centrar flechas hacia: elige centrar las flechas a ambos lados de la galería, sus imágenes o texto.
- Relleno horizontal: arrastra el control deslizante para ajustar la cantidad de espacio entre las flechas y el borde de la galería.
- Elige un estilo de flecha: haz clic para seleccionar un diseño de flecha o haz clic en el icono Agregar
Estilo del ítem
Cada imagen o video en la galería es un artículo. Puedes cambiar el aspecto de los ítems tanto para el modo Normal como para el modo Al pasar el cursor.
- Haz clic en Estilo del ítem.
- Personaliza la vista normal del ítem en Estilo del ítem:
- Color y ancho del borde: arrastra el control deslizante para cambiar el ancho del borde y haz clic en el cuadro de color para seleccionar un color.
- Radio de la esquina : arrastra el control deslizante para hacer las esquinas más redondas o cuadradas.
Nota: Las opciones Ancho y color del borde y Radio de la esquina solo están disponibles cuando eliges recortar las miniaturas en la configuración de tu diseño y solo se aplican a la imagen principal (no a las miniaturas).
- Sombra: activa la palanca para habilitar o clic en el botón de alternancia para habilitar o deshabilitar la sombra:
- Activado: el ítem de la galería tiene un sombreado a su alrededor. Personaliza la opacidad, el color, el efecto difuminado, la dirección y el tamaño del sombreado.
- Desactivado: el ítem de la galería no tiene una sombra a su alrededor.
- Elige qué sucede cuando alguien pasa el cursor sobre el elemento de la galería:
- No hay efecto: no se aplica ningún efecto al pasar el cursor.
- Acercar: acerca la imagen al pasar el cursor.
- Borroso: la imagen se desenfoca al pasar el cursor.
- Escala de grises: la imagen se convierte en blanco y negro al pasar el cursor.
- Disminuir: la imagen se reduce al pasar el cursor.
- Invertir: el color de la imagen se invierte al pasar el cursor.
- Color dentro: la imagen cambia del blanco y negro al color colorido al pasar el cursor.
- Oscurecer: la imagen se vuelve ligeramente más oscura al pasar el cursor.
- Elige qué sucede mientras se está cargando la imagen:
- Imagen borrosa: aparece una versión borrosa de la imagen durante la carga.
- Marcador de posición de color: aparece un marcador de posición de color mientras se carga la imagen.
Animaciones de desplazamiento/diapositiva
Agrega un efecto de animación que aparece a medida que los visitantes se desplazan por tu galería. Puedes personalizar aún más la animación elegida agregando un estilo de transición y ajustando su duración.
Notas:
- Las animaciones disponibles dependen del estilo de la galería que elijas.
- La personalización de la configuración de la animación solo está disponible en los diseños con desplazamiento horizontal.
Agregar una animación de desplazamiento:
- Haz clic en Animaciones de desplazamiento.
- Elige qué sucede cuando los visitantes se desplazan por la galería:
- No hay efecto: no se aplica ningún efecto al desplazamiento.
- Fundido: la imagen aparece gradualmente en el desplazamiento.
- Escala de grises: la imagen se vuelve en blanco y negro en el desplazamiento.
- Deslizar hacia arriba: la imagen se desliza hacia arriba cuando en el desplazamiento.
- Expandir: la imagen se expande en el desplazamiento.
- Disminuir: la imagen se disminuye en el desplazamiento.
- Alejar: la imagen se aleja cuando en el desplazamiento.
- Un color: se aplica un solo color a las imágenes al desplazarse.
Personalizar tu animación:
- Haz clic en Personalizar animaciones
- Personaliza la configuración de tu animación:
- Estilo de transición: haz clic en el menú desplegable para aplicar un efecto de movimiento a los elementos de la galería. Este efecto se aplica al desplazarse, a medida que los visitantes pasan de un elemento al siguiente.
- Duración: arrastra el control deslizante para ajustar la duración de la animación.
Modo expandir
Esta sección aparece si has elegido "Abrir en modo expandir" en el panel de Opciones de la Galería Pro, cuando un usuario hace clic en un elemento de la galería. Desde aquí puedes personalizar el Modo expandir de tu galería para que se adapte al diseño y a la marca de tu sitio.
- Haz clic en Modo expandir.
- Haz clic en Personalizar el modo expandir y personaliza el modo de expansión de la galería con las siguientes opciones:
- ¿Qué información se muestra? Elige mostrar un título, descripción o enlace.
- ¿Adónde aparece?Elige dónde deseas colocar la información:
- De lado: la información aparece a la derecha del elemento de la galería.
- Abajo: la información aparece debajo del elemento de la galería
- ¿Adónde se muestra?Elige cuándo mostrar la información:
- Siempre: la información se muestra siempre.
- Al hacer clic en el icono de información: la información solo aparece cuando un visitante hace clic en el icono de información en la esquina superior izquierda del Modo expandir.
- Permitir pantalla completa: elige si deseas permitir que los visitantes vean los elementos de la galería en modo de pantalla completa.
- Color del fondo: haz clic en el cuadro de color para seleccionar un color de fondo para el Modo expandir. Elige alguno de los colores de tu sitio o agrega un color.
- Color del icono: haz clic en el cuadro de color para seleccionar un color para los iconos en el Modo expandir. Elige alguno de los colores de tu sitio o agrega un color.
- Estilo del título:
- Haz clic en el menú desplegable para personalizar la fuente, el estilo y el tamaño en el selector de fuentes.
- Haz clic en el cuadro de color para cambiar el color del texto del título.
- Estilo de la descripción:
- Haz clic en el menú desplegable para personalizar la fuente, el estilo y el tamaño en el selector de fuentes.
- Haz clic en el cuadro de color para cambiar el color del texto de la descripción.
- Alineación del texto: elige la alineación del texto: izquierda, centro o derecha.
¿Te ha sido útil?
|