Cómo cambiar el color de superposición en Squarespace

Seguir este tutorial de Squarespace te ayudará a mejorar las imágenes sin tocar la sección de CSS personalizado.

Un encabezado de sitio con una superposición azul oscuro.


Cambiar el color de superposición en Squarespace puede mejorar significativamente el atractivo visual de tu sitio web. Ya sea que quieras que coincida con el encabezado de tu sitio, crear un fondo más atractivo o hacer que el texto del fondo sea más visible para tus lectores, este tutorial te guiará paso a paso por el proceso.

Tipos de Tutoriales Squarespace: Vídeo y capturas de pantalla

Entendemos que hay diferentes formas de aprender. Algunas personas prefieren un vídeo que les muestre el proceso en su totalidad, mientras que otras prefieren ver instantáneas solo de los momentos más importantes, ¡así que este blog incluirá ambas cosas!

Si prefieres un vídeo, haz clic en el botón "reproducir". Si prefieres un tutorial más autodidáctico con capturas de pantalla, haz clic aquí para que podamos bajarte a la sección de esa página.

No olvides hacer clic en el botón "Me gusta" si este vídeo te ha resultado útil. Y echa un vistazo a nuestro canal - subimos muchos tipos diferentes de vídeos de marketing que los empresarios y propietarios de pequeñas empresas pueden encontrar útiles.


Ahora las capturas de pantalla

Encontrará el icono del menú de estilos del sitio encima y a la derecha del título de su sitio. Una vez que haga clic en el icono, podrá actualizar el diseño del contenido del sitio web.

Paso uno: Navegue hasta el menú Estilos del sitio

Hay muchas formas diferentes de navegar hasta el menú de estilos del sitio. Y con una plataforma que se actualiza con frecuencia como Squarespace, descubrirás que las formas de llegar allí siempre cambian. Sin embargo, a partir de noviembre de 2024, puedes hacer clic en "Estilos" en la pestaña del sitio web o hacer clic en el icono del pincel en la parte superior derecha. Cualquiera de los dos funcionará.

Recuerde que cambiar las opciones de diseño del estilo del sitio cambiará el estilo en todo el sitio, no sólo en su nueva página o para páginas específicas.

Paso 2: Haga clic en la flecha situada junto a la paleta de colores

No haga clic en la paleta de colores. La única vez que querrá hacer clic en la paleta es si desea actualizar los colores de su marca. Si sólo desea asignar diferentes colores a diferentes partes de su sitio web, haga clic en la flecha situada junto a la paleta de colores.

Elija el tema que coincida con su sección en el lado izquierdo. Esto te permitirá actualizar las plantillas de tu tienda online.

Paso 3: Elija el tema de sección del que desea actualizar la superposición de la imagen de fondo

Verá el tema de la sección que desea actualizar en la esquina superior derecha de esa sección. Asegúrate de elegir el tema correcto o la edición no funcionará.

Verás una lista de diferentes cosas que puedes cambiar en todo el sitio en Squarespace, incluyendo los enlaces sociales, bloques y elementos, fuentes y encabezados.

Paso 4: Haga clic en el círculo de color junto a "Superposición de fondo".

Encontrará "superposición de fondo" al principio de la lista.

Recuerde que esto puede cambiar varias imágenes, dependiendo de los temas que haya elegido para su diseño. Por ejemplo, si un tema aparece en distintos lugares, la superposición cambiará en todos ellos.

Paso 5: Elija el color que desea que tenga la superposición

Puede elegir un color de su paleta o un color personalizado. Le recomendamos que elija un color de la paleta para poder ceñirse al tema de su marca. NOTA: Recuerda que el color que elijas se actualizará para cada sección que tenga asignado ese tema.

No dudes en cambiar los colores de otros elementos, como tus perfiles en redes sociales o un enlace de tu cuenta. Explore su sitio web y determine qué desea retocar.

Paso 6: Haga clic en el botón "Guardar" y, a continuación, en el botón "Salir" situado encima de la cabecera del sitio.

Si ya te gusta el aspecto de tu sección, ¡enhorabuena! Ha llegado al final del tutorial. Sin embargo, si desea aumentar o disminuir la superposición del color de fondo, ¡siga leyendo!

¿Te gusta el aspecto de tu sección? Si tu respuesta fue "sí", ¡entonces esta es tu señal para terminar el blog aquí!

Paso 7: Vaya a la página que desea actualizar y haga clic en "Editar".

El botón de edición estará en la parte superior izquierda de la vista previa de su sitio web.

Ahora haga clic en la página que desea actualizar y, a continuación, haga clic en "Editar sección" para actualizar la configuración y el diseño de esa sección. Generalmente, usted verá este pop-up en el lado derecho.

Paso 8: Desplácese hacia abajo hasta la sección a la que desea cambiar la superposición y haga clic en "Editar sección".

Para ver la ventana emergente "Editar sección", deberá pasar el cursor por encima de la sección. Una vez que pase el cursor sobre la sección, normalmente verá la ventana emergente en la esquina superior derecha de la sección.

Principiantes: fíjense en que el fondo está en la parte superior de la ventana emergente. Esto le permitirá controlar la transparencia del color.

Paso 9: Haga clic en la pestaña "Fondo

Esta pestaña estará situada en la parte superior de la ventana emergente.

Gestione la opacidad de la superposición aumentándola o disminuyéndola. Observará que al aumentarla se genera un tono más oscuro del fondo.

Paso 10: Desplácese hacia abajo y aumente/disminuya la opacidad de la superposición

Cuanto más aumentes el porcentaje de opacidad, más se verá el color que elegiste. Sigue aumentando/disminuyendo la opacidad hasta que el fondo tenga el aspecto que deseas.

Si eres nuevo creando con Squarespace, fíjate que también puedes añadir animaciones a tus imágenes. Una vez que hayas editado todo a tu gusto, haz clic en "guardar" y luego en "editar".

Paso once: Haga clic en "Guardar" y luego en "Salir" en la esquina superior izquierda.

Cuando hayas terminado de actualizar la página, guarda los cambios. Después de hacer clic en "Salir", los usuarios de tu sitio web verán el trabajo que has hecho (a menos que tu sitio web aún no sea público).

¿Y ahora qué?

Si este blog le ha resultado útil para editar su sitio web, estaremos encantados de compartir con usted otros recursos que le puedan resultar de utilidad. No sólo actualizamos regularmente nuestro blog de marketing con tutoriales, consejos y noticias, sino que también ofrecemos asesoramiento web para empresas o emprendedores que necesiten ayuda personalizada.

He aquí algunas cosas que podría aprender en nuestras sesiones:

  • Cómo editar el diseño de su sitio web.

  • Cómo utilizar las diferentes herramientas para sitios web que ofrece Squarespace.

  • Cómo configurar su sitio web para que tenga un buen rendimiento en el motor de búsqueda de Google.

  • Cómo añadir o mejorar las funciones de comercio electrónico en su sitio web.

  • Consejos para que su sitio web sea más valioso para su público objetivo.

Por supuesto, estas sesiones son totalmente personalizables. Así que también puedes acercarte a estas sesiones con tus propias necesidades y preguntas específicas, ¡y ajustaremos la agenda a partir de ahí!

Blogs relacionados

Anterior
Anterior

Cómo añadir música a un vídeo de Canva: Una sencilla guía paso a paso

Siguiente
Siguiente

¿Cómo se curvan las letras en Canva?