Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Opciones de estilo y diseño en la versión 7.1

Usa las opciones de estilo global de la versión 7.1 de Squarespace para realizar cambios de estilo a gran escala en tu sitio. Esto genera un aspecto uniforme para ayudarte a mantener una marca unificada. También puedes añadir estilo a las distintas secciones por separado y emplear las páginas de portafolio para crear páginas de aterrizaje que enlacen a tu contenido.

Esta guía se refiere a las opciones de diseño y de estilo para la versión 7.1. Para añadir contenido a tu sitio, consulta Secciones de páginas.

Consejo: esta guía es para la versión 7.1. Para los sitios de la versión 7.0, visita Cómo realizar cambios de estilo. Si no estás seguro de en qué versión está tu sitio, visita ¿Cuál es la versión y la plantilla de mi sitio?

Mira el video

Fuentes

Para abrir el panel Fuentes, haz clic en Diseño y, a continuación, en Fuentes.

En el panel Fuentes, puedes elegir un paquete de fuentes para aplicarlo a todo el texto del sitio o cambiar la fuente de tipos específicos de texto. Para obtener más información sobre cómo elegir las fuentes y aplicarles estilo, visita Cómo cambiar fuentes

Dar formato al texto

Resalta cualquier texto de la página y utiliza los íconos de la barra de herramientas para aplicar formato. Puedes seleccionar entre estos formatos de texto:

  • Encabezado 1
  • Encabezado 2
  • Encabezado 3
  • Encabezado 4
  • Párrafo 1
  • Párrafo 2
  • Párrafo 3
  • Monoespacio

Enlaces

  • Los enlaces siempre están subrayados.
  • Cuando los que visitan el sitio hacen clic en un enlace, aparece una línea de puntos alrededor de él que hace que tu sitio sea más accesible para todos los visitantes.

Colores

Para aplicar estilo a los colores del sitio, en el menú de Inicio, haz clic en Diseño y, a continuación, en Colores.

Con las paletas de colores seleccionadas, puedes hacer cambios rápidamente en todos los colores del sitio a la vez o bien, personalizar los colores de cada elemento del sitio. Para obtener más información sobre cómo cambiar los colores del sitio y de la sección, visita Cómo cambiar los colores.

Animaciones

Para agregar interés visual, puedes utilizar el panel Animaciones para animar sutilmente el contenido a medida que los visitantes se desplazan por el sitio. Para obtener más información, visita Animaciones para todo el sitio.

Botones

Para modificar el estilo de los botones del sitio, en el menú de Inicio, haz clic en Diseño y, a continuación, en Botones. En algunos casos, los ajustes no afectan a todos los botones de tu sitio. Por ejemplo, para conservar el diseño del Bloque de boletín, el ajuste de Relleno no afectará a los botones de Bloque de boletín.

Los botones tienen los mismos colores y las mismas fuentes que tu sitio.

Los bloques de botones y los bloques con botones incorporados, como los bloques de boletín, tienen opciones de estilo adicionales:

  1. Haz clic en Editar para dicha página.
  2. Pasa el cursor sobre el bloque y haz clic en el ícono del lápiz para cambiar el texto y la alineación. También puedes ajustar el tamaño de los bloques de botones.

Espacios

Para modificar el estilo del espaciado de tu sitio, en el Menú de inicio, haz clic en Diseño y, luego, en Espaciado.

Puedes editar estos ajustes:

  • Ancho de página (máximo): Cambiar el ancho máximo posible de las páginas de tu sitio. El ancho real depende de tu navegador y dispositivo. Este ajuste no afecta el espaciado del encabezado de tu sitio.
  • Margen del sitio: Cambiar el ancho del margen a cada lado del sitio. Según la configuración de Ancho de página, es posible que este ajuste no tenga un efecto visible en el contenido de tu página. Este ajuste afecta a todo tu sitio, incluido el encabezado:

Puedes cambiar el espaciado de cada sección con estilos de sección.

Estilos de elementos del producto

Para aplicar estilo a los productos, abre una página de detalles del producto y haz clic en Editar diseño en la esquina superior izquierda.

También puedes acceder a las opciones de estilo en el panel de diseño:

  1. En el Menú de Inicio, haz clic en Diseño.
  2. Haz clic en Elementos del producto.

Esta configuración afecta a las páginas de detalles del producto individuales. Ten en cuenta que algunas de estas opciones solo se aplican a productos con varias imágenes, por lo que es posible que no veas cambios si tu producto solo tiene una. Para obtener más información, visita Cómo modificar el estilo de páginas de productos.

Estilos del Bloque de imagen

Para modificar el estilo de los Bloques de imagen:

  1. En el menú de Inicio, haz clic en Diseño y, a continuación, en Bloques de imagen.
  2. Haz clic en el bloque cuyo estilo deseas modificar para encontrar los ajustes que se aplican a dicho bloque.

Para obtener más información sobre los estilos de bloque de imagen, visita Bloques de imagen

Fondo

Para cambiar el fondo:

  • Usa el panel de Colores para cambiar el fondo del sitio.
  • Usa los estilos del sitio para cambiar el color de fondo de cada sección por separado o para añadir imágenes de fondo o de videos. Esto incluye las secciones del pie de página.
  • Cuando una sección tiene una imagen de fondo configurada en Recuadro, puedes configurar el color del borde del recuadro.
  • El encabezado tiene el mismo color de fondo que la sección superior cuando es transparente. Desactiva la transparencia en el editor de encabezado a fin de seleccionar otro motivo de colores para el encabezado.

Cabeceras

Para crear un banner:

  1. En la esquina superior izquierda, haz clic en Editar.
  2. Añade una sección de bloques y presiona su icono del lápiz.
  3. Haz clic en Fondo para añadir una imagen o un video.
  4. Haz clic en Colores para modificar el estilo del texto superpuesto y para añadir un color de superposición.
  5. Añade otras secciones de bloques debajo para el contenido de la página.

Consejos:

  • Si solo quieres un banner de imagen, empieza por una sección En blanco.
  • Los bloques añadidos en la sección se superpondrán al banner.
  • Para cambiar la altura, haz clic en el icono del lápiz y selecciona la altura de la sección.
  • Cuando elijas una imagen de fondo, sigue nuestros consejos de formato de las imágenes.

Encabezado

Los que visitan el sitio usan el encabezado de la parte superior para navegar por el sitio. En la versión 7.1, el encabezado tiene el título del sitio web o su logotipo y los enlaces de navegación. Puedes agregar el icono del carrito de compras, los iconos de las redes sociales y un botón de llamada a la acción.

Para obtener más información, visita Cómo crear un encabezado de sitio.

Pie de página

Para editar tu pie de página:

  1. En la esquina superior izquierda, haz clic en Editar.
  2. Posiciona el cursor sobre el pie de página y haz clic en Editar pie de página.
  3. Añade contenido al pie de página con secciones.

Restablecer el estilo predeterminado

Para algunas opciones de estilo del panel Diseño, puedes restablecer el estilo a los valores predeterminados del sitio. Esto devuelve el área a la forma original en que se estableció cuando iniciaste el sitio por primera vez.

  1. En el menú de Inicio, haz clic en Diseño y, a continuación, en el área que deseas restablecer.
  2. Desplázate hasta la parte inferior del panel y haz clic en Restablecer estilos a valores predeterminados.
  3. Haz clic en Restablecer para confirmar.
  4. Haz clic en Guardar.
Nota: Después de guardar, este cambio no es reversible.

Estilos de sección

Para modificar el estilo de una sección, edita la página, posiciona el cursor sobre la sección y, luego, haz clic en el icono del lápiz. 

pencil-icon.png

Aquí puedes elegir también diferentes diseños para las secciones de colección y de galería.

Si introduces cambios de estilo en una sección de colección, estos afectarán a todos los diseños del mismo tipo. Por ejemplo, si tienes dos secciones de blog y ambas usan una distribución de mampostería, cualquier cambio que hagas, como alinear el texto, afectará a ambas secciones.

Los estilos de la sección anulan los estilos globales para todo el sitio.

Plantillas de la versión 7.1

Todos los sitios que empleen la versión 7.1 usan la misma plantilla. Esto significa lo siguiente:

  • Todos ellos tienen las mismas opciones y características de estilo.
  • Todos ellos usan secciones para añadir contenidos a las páginas.

No es necesario cambiar de plantilla, por lo que esa opción no está disponible en la versión 7.1. Para probar diferentes aspectos en tu sitio:

  • Actualiza tus estilos globales.
  • Agrega nuevas páginas con diferentes diseños de página predefinidos.
  • Crea nuevas secciones para cambiar el aspecto de una página. Por ejemplo, agrega una sección con una imagen de fondo a la parte superior para crear un banner de página.

Para obtener más detalles, consulta Squarespace versión 7.1 o Squarespace versión 7.0.

Aprende más en un seminario web

Además de nuestras guías y tutoriales en video, ofrecemos un seminario web Introducción a Squarespace 7.1. En esta sesión en directo, te guiaremos por los conceptos básicos de la configuración de tu sitio en la versión 7.1, incluida la creación de páginas y el ajuste de estilos del sitio. Normalmente, los seminarios web duran una hora y no necesitas un sitio o una cuenta de Squarespace para registrarte.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 88 de 475
Opciones de estilo y diseño en la versión 7.1