Cómo aplicar estilo a páginas de galería en la versión 7.0

Ajusta los elementos de diseño en las páginas de galería de la versión 7.0 para personalizar tu sitio.

Última actualización: 9 de enero de 2025

Puedes ajustar el tamaño de imagen, cambiar el diseño y personalizar tu página de galería en el panel de estilos del sitio.

Cómo acceder a esta función

Esta guía se refiere a la versión 7.0. La versión 7.1 usa secciones de galería en cambio.

Visualización de la página de galería por plantilla

La página de galería de cada plantilla tiene uno de los siguientes estilos de visualización de manera predeterminada:

  • Diapositivas: muestra una imagen o video a la vez. Los que visitan el sitio pueden hacer clic para avanzar a la siguiente diapositiva o puedes configurar la galería para que se reproduzca automáticamente. Las diapositivas en reproducción automática pausan cuando posicionas el cursor sobre ellas.
  • Cuadrícula: muestra el contenido en una cuadrícula. Ajusta la relación de aspecto, el relleno y la cantidad de imágenes en miniatura por fila desde estilos del sitio.
  • Apilado: presenta el contenido en una única columna con un píxel de relleno entre cada imagen o video.
  • Carrusel: muestra el contenido en una fila horizontal. Los que visitan el sitio pueden hacer clic para avanzar a la siguiente diapositiva o puedes configurar la galería para que se reproduzca automáticamente.

El estilo de tu página de galería depende de tu plantilla. La mayoría de las plantillas usan la página de galería estándar, que se muestra como una cuadrícula o como diapositivas. Otras plantillas tienen páginas de galería específicas para la plantilla con características, ajustes de estilo y diseños únicos.

  • Adirondack
  • Aviator
  • Bedford
  • Brine
  • Farro
  • Five
  • Galapagos
  • Native
  • Pacific
  • Skye
  • York: también admite una página de proyecto única, similar a una página de galería.
  • Avenue: diapositivas
  • Flatiron: Apilada
  • Forte: Carrusel con una presentación de lightbox.
  • Ishimoto: Carrusel
  • Momentum: Diapositivas u opción de mostrarla como cuadrícula
  • Montauk: Apilada
  • Supply: Apilada
  • Tremont: Apilada, mampostería o cuadrícula horizontal
  • Wells: diapositivas o cuadrícula
  • Wexley: Cuadrícula con una presentación en lightbox

Páginas de Galería en un Índice

Puedes añadir páginas de galería a un índice de estas familias de plantillas. Algunas galerías tienen formato especial cuando se las abre desde el índice. Consulta sus guías de plantillas para obtener más ayuda.

  • Avenue: Apilada cuando lo abres desde el Índice.
  • Brine: las secciones de índice de galería se muestran como una cuadrícula o una presentación de diapositivas.
  • Flatiron: Muestra los elementos de navegación cuando se la abre desde el Índice
  • Forte
  • Momentum
  • Montauk: muestra los elementos de navegación cuando se la abre desde un índice, y no aparecen los banners
  • Pacific: las secciones de índice de galería se muestran como una cuadrícula o una presentación de diapositivas.
  • Supply
  • Tremont: La presentación de la página de aterrizaje del Índice aparece en la parte inferior
  • York

Aplicar estilo a la página de galería estándar

Para las plantillas que utilizan la página de galería estándar, sigue los pasos de esta sección. Para las plantillas con páginas de galería únicas, consulta sus guías de plantillas.

Elegir el diseño

La página de galería estándar admite dos diseños. Para definir el estilo de diseño:

  1. Abre la página de galería.
  2. Regresa al panel de Sitio web, haz clic en Diseño y luego haz clic en Estilos del sitio.
  3. Desplázate hasta Estilos de galería.
  4. Usa el ajuste Diseño de galería para elegir Diapositivas o Cuadrícula.

Consejo

Esto establece el diseño de todas las páginas de galería de tu sitio. Para crear galerías con diferentes diseños, utiliza un bloque de galería.

Aplicar estilo al diseño de la presentación de diapositivas

El diseño de diapositivas muestra una imagen o video por vez. Puede incluir elementos de navegación, como la flecha y las miniaturas en el ejemplo siguiente, y puedes configurarlo para reproducción automática.

Los siguientes retoques aparecen en la sección Estilos de galería cuando Diseño de galería se configura como Diapositivas.

Ocultar la navegación o aplicarle estilo:

  • Navegación de la galería: elige el tipo de navegación (miniaturas, viñetas, números, círculos, simple). Elige Ninguna para ocultar la navegación.
  • Estilo de flechas de la galería: aplica estilo a las flechas utilizadas para recorrer las diapositivas (esquinas redondas, rectangulares, circulares, sin fondo).
  • Mostrar Flechas de la Galería; Desmarca esta opción para ocultar las flechas en la visualización de tu galería
  • Tamaño de miniatura de la galería: establece la altura de la navegación de la imagen en miniatura.
  • Fondo de las flechas de la galería
  • Color de las flechas de la galería
  • Color del Círculo de la Galería

Elige la forma de las imágenes:

  • Relación de aspecto de la galería: establece la relación de aspecto (ancho:alto). Utilízala con el retoque Recorte automático de la galería.
  • Recorte automático de la galería: recorta automáticamente las imágenes de acuerdo con la relación de aspecto establecida con el retoque Relación de aspecto de la galería.

Establecer cómo se muestran las leyendas:

  • Superposición de información de galería: mostrar siempre, mostrar al desplazar el cursor, ocultar. El tipo de visualización que se utiliza para los títulos leyendas de las imágenes.
  • Fondo de la Información de la Galería - El color se usa como fondo para los títulos y las leyendas de las imágenes.

Elige la transición de las imágenes dentro de la presentación de diapositivas:

  • Transiciones de la galería: difuminar, desplazar
  • Reproducción automática de la galería: pasa las imágenes automáticamente sin la interacción del usuario. Las diapositivas en reproducción automática pausan cuando posicionas el cursor sobre ellas.
  • Repetición de la Galería - Habilita a la galería para que después de la última diapositiva pase a la primera.
  • Velocidad de reproducción automática de la galería (segundos)

Aplicar estilo al diseño de cuadrícula

Los siguientes ajustes aparecen en la sección Estilos de galería cuando Diseño de galería está configurado como Cuadrícula.

Elige la forma y el tamaño de las imágenes:

  • Relación de aspecto: establece la relación de aspecto (ancho:alto) de las imágenes. Si estableces la relación de aspecto en Auto, las imágenes se reorganizan para crear el mejor ajuste en la página. Pueden mostrarse en un orden diferente al que se subieron.
  • Grid Spacing (Espacio de Cuadrícula): Aumenta el relleno entre las imágenes individuales en tu cuadrícula.
  • Min Column Width (Ancho mínimo de columna): Establece el ancho de las columnas en tu cuadrícula.

Aplicar estilo al lightbox:

  • Estilo de lightbox: oscuro, claro

Aplicar estilo a las leyendas

Si deseas obtener ayuda para cambiar el estilo de las fuentes de los títulos y las descripciones de tus imágenes, consulta Modificar el estilo de las leyendas de las imágenes.

La forma en que aparecen las leyendas depende de tu plantilla. Para las plantillas con la página de galería estándar:

  • Diapositivas: el texto puede ocultarse, mostrarse cuando se pasa el cursor sobre una imagen o mostrarse siempre, según cómo definas el ajuste Superposición de información de la galería
  • Cuadrícula: Se mostrará el texto cuando posiciones el cursor sobre una imagen en vista de lightbox.
  • El texto nunca se muestra para los videos.

Así aparecen los títulos y las descripciones de las imágenes en las páginas de galería exclusivas de estas familias de plantillas:

Familia de plantillas Notas

Avenue

Solo se mostrará el texto cuando la Página de Galería sea parte de un Índice.

Flatiron

Nunca aparece el texto.

Forte

Siempre aparece el texto.

Ishimoto

Puedes ocultar o mostrar siempre el texto.

Momentum

El texto aparece siempre cuando se presiona el icono "i".

Montauk

Siempre aparece el texto.

Supply

Aparece el texto de las imágenes en una superposición cuando presionas el icono + con el cursor posicionado sobre él.

Nunca mostrar el texto para videos.

Tremont

Elige entre Mostrar Leyendas: al posicionar el cursor o Siempre. Al posicionar el cursor, las leyendas aparecerán cuando coloques el cursor sobre el ícono del círculo en la esquina inferior derecha.

En el diseño apilado, puedes mostrar Leyendas debajo de la imagen. Selecciona Pantalla de leyendas: siempre para habilitar este ajuste.

Wells

Siempre aparece el texto.

Wexley

Los títulos de las imágenes se muestran al posicionar el cursor sobre ellas. Usa el ajuste Habilitar Imagen en Miniatura al Posicionar el Cursor para mostrar u ocultar los títulos.

Los títulos de las imágenes nunca se muestran en la lightbox ni en dispositivos móviles. Las descripciones de las imágenes no se muestran nunca.

York

York tiene la Página de Galería estándar.

En la Página de Proyecto, el texto aparece al lado o debajo de las imágenes, según su orientación.

Añadir enlaces especiales

Algunas Páginas de Galería admiten modos de enlazar desde y hacia tus imágenes.

  • Las URL de enlace profundo son URL personalizables que se asignan a cada imagen, de modo que puedas dirigir a los que visitan el sitio a cualquier imagen dentro de una Página de Galería.
  • Las URL clickthrough convierten las imágenes en enlaces a páginas externas, páginas internas o archivos.

Consejo

las URL clickthrough desactivan los lightbox. Adirondack solo admite URL de enlace profundo y URL clickthrough en la vista de diapositivas.

Navegación con el teclado

La mayoría de las plantillas te permiten usar las flechas del teclado para pasar por las imágenes. Tal vez tengas que hacer clic en la página antes de que funcione la navegación con el teclado.

La página de galería estándar admite la navegación por teclado en el diseño Diapositivas, pero no cuando se abre una imagen en un lightbox desde el diseño Cuadrícula.

Todas las páginas de galería únicas admiten la navegación por teclado (presentaciones de diapositivas, carrusel y vistas de lightbox).

Reproducción automática de las galerías

Puedes establecer una transición automática entre las imágenes de algunas plantillas; de este modo, quienes las vean no tienen que hacer clic para pasar a la siguiente imagen.

Si tu plantilla tiene una función de reproducción automática, encontrarás esta opción en estilos del sitio. Por ejemplo, en las plantillas que usan la página de galería estándar, marca el ajuste Reproducción automática de galería.

Nota

si tu galería incluye un video, el desplazamiento automático impide que se reproduzca hasta que termine. Para evitar que se interrumpa tu video, sube una imagen destacada para activar la superposición de imagen.

Visualización en dispositivos móviles

Todas las plantillas de Squarespace tienen incorporado el diseño adaptable para garantizar que tus Páginas de Galería se vean fantásticas en cualquier dispositivo. Para ver una vista previa de tu Página de Galería en dispositivos móviles, usa la vista en dispositivo.

Para más información, visita ¿Cómo aparecerá mi sitio en un dispositivo móvil?

Más opciones de estilo

Para crear un aspecto diferente al disponible en la página de galería de tu plantilla, puedes usar alguna de las siguientes alternativas:

También puedes crear varias galerías con distintos estilos de visualización utilizando una combinación de páginas de galería y páginas de diseño con bloques de galería.

Footer Image
  • Recibe ayuda de nuestra comunidad

  • Recibe la ayuda de nuestra comunidad para personalizaciones avanzadas.

  • Contrata a un Squarespace Expert

  • Destácate en línea con la ayuda de un diseñador o desarrollador con experiencia.

Cómo aplicar estilo a páginas de galería en la versión 7.0