La página de proyecto en la familia de plantillas York es una vista de galería personalizada, diseñada con el fin de crear elegantes diseños para portafolios. Usa la página de proyecto para elaborar diseños que combinen texto e imágenes de maneras atractivas.

York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori y Taylor comparten la misma estructura y las mismas funciones de base. Esta guía se refiere a todas estas plantillas. Estas plantillas también admiten páginas de galería, que ofrecen distintas opciones.

La versión 7.1 no admite páginas de proyecto. No puedes añadir ni editar páginas del proyecto en la aplicación de Squarespace.

Configurar la Página de proyecto

Para configurar una Página de proyecto:

1. Abre el panel Páginas.
2. Haz clic en el icono + para añadir un Proyecto.
3. Para obtener los mejores resultados, añade varias imágenes o videos e incluye un título y una descripción a cada uno de ellos.

Añadir imágenes y videos

Para añadir imágenes y videos:

1. Abre el panel Páginas.
2. Haz clic en tu Página de proyecto, en el panel de la izquierda.
3. Sube imágenes, añade imágenes de stock y carga videos. Todos los videos deben tener una imagen en miniatura.
4. Configura el estado de publicación de tu imagen o video.

Para editar la configuración de las imágenes y los videos que ya hayas cargado, haz doble clic en la imagen o en el video en el panel lateral.

Diseño

Utiliza la sección Proyecto: diseño de estilos del sitio para ajustar el diseño.

• Alineación de las imágenes: Alinea todas las leyendas y las imágenes a la derecha, la izquierda o centradas.
• Espaciado de las imágenes: ajusta el espacio entre cada imagen del proyecto.
• Espaciado de los banners: ajusta el espacio entre el encabezado de la página y la primera imagen. La altura del texto en la sección Página: texto introductorio también puede modificarlo.
• Permitir ancho completo vertical y cuadrado: Muestra las imágenes verticales y cuadradas con el ancho del área principal de contenidos. Si has seleccionado Proyecto sin bordes, aparecerán con el ancho del navegador. Este ajuste está habilitado cuando se ha configurado Estilo de leyenda vertical y cuadrado como Estándar o Desplazado.

Nota: Las páginas de proyectos no admiten lightboxes ni direcciones URL de enlaces profundos. Puedes añadir URL clickthrough a las imágenes de la página de proyecto, que funcionarán cuando se conecten a bloques de galería o bloques de sumario, pero no funcionarán en la página de proyecto en sí. Si quieres un enlace que funcione en la página del proyecto, añade un enlace a la leyenda de la imagen.

Añadir leyendas

Para añadir o ajustar el texto del título y de la descripción:

1. Abre el panel Páginas.
2. Haz clic en la Página de proyecto.
3. Haz doble clic en la imagen en el panel lateral.
4. Añade tu texto en los campos Título y Descripción.

Los títulos y las descripciones aparecen debajo de las imágenes horizontales y debajo o al lado de las imágenes verticales y cuadradas. Ajusta su diseño en la sección Proyecto: diseño de estilos del sitio.

• Utiliza el ajuste Mostrar leyendas del proyecto para mostrar u ocultar todos los nombres de imagen y el texto descriptivo.
• Contraer espaciado horizontal quita el espacio debajo de las imágenes horizontales que no tienen leyendas.

Usa los ajustes de Proyecto: sección de fuentes en estilos del sitio para modificar el estilo del texto del título y las descripciones de tus imágenes.

• Para justificar el texto a la izquierda, la derecha o el centro, usa los ajustes Alineación del título de la leyenda y Alineación del cuerpo de la leyenda.
• Para las leyendas que aparecen al lado de imágenes verticales o cuadradas, usa el ajuste Alternar las leyendas de las imágenes.

Si seleccionaste Alineación de la imagen: Centro y marcaste Mostrar las leyendas del proyecto, puedes ajustar también en qué lugar de la página aparecen las leyendas con los ajustes Estilo de leyenda vertical y cuadrado y Estilo de leyenda horizontal.

• Para cualquiera de estos ajustes, elegir Estándar muestra la leyenda directamente debajo de la imagen y Desplazada mueve la leyenda más abajo con el mismo espacio desde la siguiente imagen.
• Elegir Estilo de leyenda vertical y cuadrado: alternativo mueve las leyendas al lado de las imágenes cuadradas y verticales. Las leyendas alternan a la derecha y la izquierda de las imágenes. Las imágenes que no tengan leyendas estarán centradas.
• Elegir Estilo de leyenda horizontal: recuadro mueve las leyendas hacia arriba, debajo de las imágenes horizontales, para que se superpongan levemente.

Tamaños de imágenes y videos

Las imágenes de las Páginas de proyecto nunca se extenderán más allá de sus dimensiones originales, incluso si las configuras sin bordes. Esto impide que tus imágenes se vean difusas o pixeladas.

• Por lo general, el tamaño de la imagen de tu Página de proyecto se determina según las dimensiones originales de tu imagen. Si quieres que la imagen aparezca más grande en la página, carga una imagen de dimensiones más grandes.
• Para reducir el tamaño de la imagen en la página, carga una imagen con dimensiones más pequeñas.
• El ajuste Relleno externo del sitio puede afectar el ancho de las imágenes que no se configuran como imágenes sin bordes.
• El ancho del video lo configura el sitio que lo aloja. Para personalizar el ancho del video, usa el código de inserción el video y selecciona manualmente el ancho dentro del código.
• Si necesitas ayuda con los banners y el diseño adaptativo, lee nuestras mejores prácticas.

Imágenes sin bordes

Las imágenes sin bordes se extienden hasta los bordes del navegador e ignoran el relleno externo. Para habilitarlo, primero verifica que tus imágenes tengan el tamaño adecuado. Las imágenes de las páginas de proyecto nunca se extienden más allá de sus dimensiones originales. Tampoco se mostrarán más anchas que 2500 píxeles debido a como Squarespace optimiza el diseño adaptativo, pero te recomendamos cargar imágenes de, al menos, 2500 píxeles de ancho para obtener los mejores resultados.

Si tus imágenes son suficientemente anchas, puedes usar estilos del sitio para hacer que no tengan bordes. Esto afectará a todas las páginas de proyecto de tu sitio.

En las Páginas de proyecto, las imágenes solo pueden aparecer sin bordes en los siguientes casos:

• Las imágenes están centradas.
• Las leyendas están debajo de las imágenes.
• Las imágenes horizontales deben configurarse como imágenes sin bordes antes de que las imágenes verticales puedan configurarse como imágenes sin bordes.

Para mostrar todas tus imágenes sin bordes, primero configura las imágenes horizontales:

1. Abre estilos del sitio y desplázate hasta la sección Proyecto: diseño.
2. Elige Alineación de la imagen: centro. Esto centra tus imágenes.
3. Verifica que Mostrar leyendas de las imágenes esté marcado, incluso si no tienes leyendas.
4. Elige proyecto sin bordes. Esto configurará tus imágenes como imágenes sin bordes.

Luego puedes configurar las imágenes verticales:

1. Elige Estilo de leyenda vertical y cuadrada: estándar o desplazad. Esto mueve cualquier leyenda debajo de las imágenes no horizontales.
2. Marca Permitir ancho completo vertical y cuadrado. Esto establece que las imágenes no horizontales no tengan bordes.
3. Save and refresh the page.

Mover imágenes

Para modificar el orden de las imágenes en la página, cambia el orden dentro del panel de página. El panel lateral de las páginas de proyecto tiene la misma funcionalidad que las páginas de galería.

Puedes mover una imagen y su título y leyenda correspondientes entre cualquier Página de proyecto o Página de galería. Para obtener más información, visita Mover contenido entre páginas.

Encabezado y pie de página

Además de las imágenes y las leyendas, las Páginas de proyecto admiten lo siguiente:

• Banners de página: una imagen o video que aparece en la parte superior de la página.
• Texto del título, descripción y categoría de página: texto que aparece en la parte superior de la página. Si tienes un banner de página, este texto aparece arriba de la imagen o del video.
• Áreas para el encabezado y para el pie de página: áreas en la parte superior y en la parte inferior de la página que puedes personalizar con tu propio contenido.

Si la página de tu proyecto no tiene una imagen destacada, la primera imagen agregada a la página de tu proyecto se convierte automáticamente en la imagen de banner en la parte superior. Agrega una imagen destacada para reemplazarla o desmarca Mostrar banner del proyecto en los estilos del sitio para ocultarla en todas las páginas del proyecto.

Carga de las páginas

Las imágenes y las leyendas de las Páginas de proyecto aparentan deslizarse de arriba abajo cuando te desplazas hacia abajo en la página. Para deshabilitar este efecto, quita la marca en el ajuste Imágenes y leyendas en cascada. Cuando la opción está desmarcada, las imágenes y las leyendas ingresan difuminadas.

Página de galería versus Página de proyecto

Además de las páginas de proyecto, estas plantillas admiten páginas de galería estándar.

Mientras que las páginas de proyecto son buenas para una combinación de imágenes y texto, las páginas de galería son ideales para centrarse únicamente en las imágenes y los videos. A diferencia de las páginas de proyecto, las páginas de galería admiten URL de enlace profundo, URL clickthrough y funciones de lightbox.

Para probar ambas opciones, puedes mover las imágenes entre las Páginas de galería y las Páginas de proyecto.

Nota: Las Páginas de galería no admiten videos en el banner de página.

Cómo cambiar de plantilla

Si cambias a cualquier plantilla distinta de York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori o Taylor, tus Páginas de proyecto se convertirán en Páginas de galería.

Si vuelves a cambiar a York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori y Taylor, es posible que debas crear nuevas páginas de proyecto y páginas de galería y mover las imágenes a estas páginas para recrear el formato original.

Móvil

En los dispositivos móviles y los navegadores más estrechos, el contenido se apila verticalmente en una sola columna.