Cómo cambiar la fuente en Squarespace 7.1 (Site Styles + CSS)
Cambia la fuente en Squarespace 7.1 desde Site Styles, sube tu propio archivo de fuente o usa CSS para un solo elemento. Pasos, tabla y soluciones.
Preguntas frecuentes
¿Cómo cambio la fuente de todo mi sitio en Squarespace?
En un sitio con la versión 7.1, abre Site Styles (Estilos del sitio), haz clic en Fonts (Fuentes) y elige un paquete de fuentes recomendado, o abre All Font Packs (Todos los paquetes de fuentes) y filtra por sans-serif, serif o mixtas. Un paquete de fuentes define de una sola vez las fuentes de los títulos, los párrafos, los botones y el texto misceláneo.
¿Puedo usar cualquier Google Font en Squarespace?
Puedes buscar Google Fonts por nombre en el menú desplegable de fuentes, pero el propio centro de ayuda de Squarespace aclara que no todas las Google Fonts están en su biblioteca. Si la que quieres no aparece, puedes subir tú mismo el archivo de la fuente, siempre que la licencia lo permita.
¿Qué tipos de archivo de fuente puedo subir a Squarespace?
El cargador de fuentes de Site Styles acepta archivos OTF, TTF, WOFF y WOFF2. El área independiente de Custom Files (Archivos personalizados) que se usa con el editor de CSS admite TTF, OTF y WOFF, así que para un archivo WOFF2 usa el cargador de Site Styles y no el área de archivos de CSS.
¿Necesito permiso para subir una fuente personalizada?
Sí. El centro de ayuda de Squarespace indica que necesitas el permiso del propietario o del licenciante de la fuente para usarla en tu sitio. Revisa que la licencia cubra el uso web antes de subirla.
¿Por qué los pasos para cambiar la fuente son distintos en mi sitio?
Los sitios con versión 7.0 y con versión 7.1 tienen ajustes de fuentes diferentes. Los pasos de esta guía son para la 7.1. En la 7.0, los cambios de fuente se hacen desde Site Styles dentro del panel Design (Diseño). Squarespace también señala que las fuentes de Adobe personalizadas configuradas en la 7.0 no son compatibles con la 7.1, así que tendrías que elegir una fuente integrada de la 7.1.
¿El CSS personalizado se conserva si cambio de plantilla?
En un sitio con versión 7.0, Squarespace indica que el CSS personalizado no se transfiere al cambiar de plantilla. Guarda una copia de todo el CSS que añadas para poder pegarlo de nuevo si lo necesitas.
Respuesta rápida: En un sitio Squarespace 7.1, abre Site Styles (Estilos del sitio), haz clic en Fonts (Fuentes) y elige un paquete de fuentes, o define por separado Headings (Títulos), Paragraphs (Párrafos), Buttons (Botones) y Miscellaneous (Misceláneos). Para usar una fuente que no está en la biblioteca, sube tu propio archivo en el mismo panel. Usa CSS personalizado solo cuando necesites cambiar un elemento concreto.
Esta guía cubre los pasos de la versión 7.1, tal como los describe el propio centro de ayuda de Squarespace (consultado en noviembre de 2026). Si tu sitio está en la versión 7.0, los nombres de los paneles son distintos; consulta la nota sobre versiones casi al final.
¿Qué método te conviene?
Elige la opción más sencilla que te dé el resultado que buscas. Cada fila de la tabla requiere un poco más de preparación que la anterior.
| Lo que quieres | Mejor método | Esfuerzo |
|---|---|---|
| Un aspecto totalmente nuevo con un clic | Paquete de fuentes en Site Styles | Bajo |
| Fuentes distintas para títulos y texto del cuerpo | Fuentes por categoría en Site Styles | Bajo |
| Una Google Font concreta | Búsqueda en el menú desplegable de fuentes | Bajo |
| Una fuente de marca para la que tienes licencia | Subir un archivo de fuente | Medio |
| Solo un título, un botón o una sección | CSS personalizado | Medio a alto |
Método 1: Cambiar las fuentes con un paquete de fuentes
Un paquete de fuentes define fuentes que combinan entre sí para todas las categorías de texto a la vez, así que es la forma más rápida de renovar el aspecto de un sitio.
- Abre el editor y haz clic en Site Styles (el icono del pincel).
- Haz clic en Fonts.
- Elige uno de los paquetes recomendados, o haz clic en All Font Packs y filtra por sans-serif, serif o mixtas.
- Recorre tus páginas para revisar los títulos, el texto del cuerpo y los botones antes de cerrar el panel.
Los paquetes son un buen punto de partida, pero puede que te quedes con una fuente de títulos que te gusta y una de cuerpo que no. De eso se encarga el siguiente método.
Método 2: Cambiar la fuente de una sola categoría de texto
En Fonts, Squarespace divide el texto en cuatro grupos. Puedes configurar cada uno por separado:
- Headings (Títulos): los títulos de página y los estilos de encabezado de tus bloques de texto.
- Paragraphs (Párrafos): el texto del cuerpo.
- Buttons (Botones): las etiquetas de los botones.
- Miscellaneous (Misceláneos): texto más pequeño, como pies de foto y etiquetas de formularios (el alcance exacto de este grupo varía según la plantilla, así que revisa algunas páginas después de cambiarlo).
Para cambiar una categoría:
- En Site Styles > Fonts, haz clic en la categoría que quieras, por ejemplo Headings.
- Abre el menú desplegable de fuentes y busca por nombre.
- Elige la fuente y ajusta su estilo, grosor y tamaño según necesites.
- Para Adobe Fonts, usa el enlace Additional Fonts (Fuentes adicionales) que aparece al final de la lista.
Squarespace también te permite definir un tamaño base a partir del cual se escala el resto del texto. Por eso, si todo se ve demasiado grande o pequeño después del cambio, ajusta primero ese valor antes de cambiar el tamaño de cada bloque.
Un consejo práctico: cambia los títulos y los párrafos en pasos separados. Si cambias ambos a la vez y algo se ve raro, no sabrás cuál lo causó. Si necesitas ayuda para elegir una combinación, consulta nuestra guía sobre cómo elegir las fuentes de un sitio web.
Método 3: Subir tu propia fuente
Si tu marca usa una fuente que no está en la biblioteca, súbela. Squarespace indica que necesitas el permiso del propietario o del licenciante de la fuente para usarla de esta manera.
- Consigue el archivo de la fuente en formato OTF, TTF, WOFF o WOFF2. El cargador de Site Styles acepta los cuatro.
- Abre Site Styles > Fonts, elige una categoría (o el menú desplegable de fuentes) y busca la opción de subir archivos.
- Arrastra tu archivo al panel de fuentes subidas, o haz clic en el icono de más (+) y selecciónalo desde tu computadora.
- Selecciona la fuente subida para la categoría que quieras.
- Publica y revisa el sitio en vivo en computadora y en el teléfono para confirmar que la fuente se carga.
Los textos de la interfaz cambian de vez en cuando, así que si un botón tiene otro nombre, busca el icono de subir o de más dentro del menú desplegable de fuentes.
Problemas habituales al subir fuentes
- La fuente aparece en la lista, pero se ve mal. Es posible que al archivo le falte un grosor o estilo (negrita, cursiva). Sube cada grosor que pienses usar como un archivo independiente.
- La fuente funciona en el editor, pero no para los visitantes. Actualiza la página publicada forzando la recarga y revisa que la licencia de la fuente cubra el uso web.
- Subiste un archivo WOFF2 e intentaste referenciarlo desde el área de archivos de CSS. El área de Custom Files del editor de CSS admite TTF, OTF y WOFF como tipos de fuente, no WOFF2. Para WOFF2, usa el cargador de Site Styles.
Método 4: Cambiar un solo elemento con CSS personalizado
Site Styles cambia las fuentes en todo el sitio por categoría. Cuando necesitas una excepción, como un único título con otra fuente, el CSS personalizado puede resolverlo. La propia guía de CSS de Squarespace recomienda limitar el CSS a fuentes, colores y fondos, porque otros cambios pueden romper tu diseño.
- Sube primero la fuente con el Método 3, o elige una fuente de la biblioteca, para que ya esté disponible en tu sitio.
- Abre Website > Pages > Custom CSS (la ruta exacta puede variar un poco según el sitio).
- Pega una regla como la de abajo y guarda.
```css /* Ejemplo: hacer que todos los H2 usen una fuente que ya está en tu sitio */ h2 { font-family: "Your Font Name", serif; letter-spacing: 0.02em; }
/* Ejemplo: cambiar solo el texto de los botones */ .sqs-button-element--primary { font-family: "Your Font Name", sans-serif; } ```
Sustituye "Your Font Name" por el nombre exacto que aparece en Site Styles. La fuente genérica de respaldo (serif o sans-serif) mantiene el texto legible si la fuente no se carga. Los nombres de clase pueden variar según la plantilla y las actualizaciones de Squarespace, así que usa el inspector de tu navegador para confirmar el selector del elemento que quieres modificar.
Si aplicas CSS a una sola página, el centro de ayuda de Squarespace describe opciones a nivel de página para esto; confirma allí los pasos actuales antes de depender de ellos.
Lista de revisión rápida antes de publicar
Copia esta lista y repásala una vez.
- [ ] Los títulos y el texto del cuerpo usan como máximo dos familias tipográficas.
- [ ] El texto del cuerpo se lee bien en el teléfono, no solo en computadora.
- [ ] Todos los grosores que usas (normal, negrita, cursiva) están disponibles en la fuente.
- [ ] Tienes licencia para usar en la web cualquier fuente que hayas subido.
- [ ] Los botones y las etiquetas de formularios usan una fuente que combina con el resto de la página.
- [ ] Guardaste una copia de todo el CSS personalizado que añadiste.
- [ ] Revisaste el sitio en vivo, no solo la vista previa del editor.
Versión 7.0 frente a 7.1
El centro de ayuda de Squarespace indica que las opciones de fuentes de la 7.1 se aplican a los sitios 7.1 y que los sitios 7.0 tienen sus propios ajustes de fuentes. En la 7.0, los cambios de fuente se hacen desde Site Styles dentro del panel Design. Si estás pensando en migrar, Squarespace cuenta con una herramienta de actualización, y nuestra reseña de Squarespace explica cómo se compara el editor actual. Si las fuentes son solo una de varias cosas que te frustran, la página de alternativas a Squarespace enumera otros creadores de sitios, y nuestro desglose de costos muestra cuánto cuesta en total un sitio Squarespace.
Si vas a empezar un sitio nuevo
Cuando elijas una plantilla o construyas un sitio desde cero, define primero la tipografía. Es más fácil que corregirla después. El plan gratuito de We.Inc te permite publicar hasta tres sitios a partir de plantillas prediseñadas; el creador con IA que redacta un sitio a partir de una instrucción comienza en el plan Starter, a $20 al mes. Puedes registrarte aquí.
Empieza gratis · Sin tarjeta de crédito
Fundador de We.Inc
Umair es el fundador de We.Inc. Escribe sobre la creación de sitios web con IA, las agencias y el negocio de gestionar un estudio web.
¿Listo para crear algo grande?
Únete a los 15,000+ negocios que usan We.Inc para lanzar, crecer y automatizar, todo desde una plataforma.
Empieza gratisSin tarjeta de crédito · Habla con ventas
Relacionado: Blog
- Cómo implementar un asistente conversacional en tu empresa
- Diseño web para quiroprácticos
- Web para iglesias
- Qué crear con el modelo Opus 5 (2026)
- Cómo crear una web para una empresa de limpieza
- Plataformas de ecommerce en la nube
- Reseña de Cloudflare Registrar
- Sitio web para coaches
Producto
Para quién es
- Para agencias
- Para freelancers
- Para proveedores de hosting
- Para plataformas SaaS
- Para startups
- Servicios financieros
- Soluciones para salud
Funciones
Recursos
- Blog
- Centro de Ayuda
- Herramientas gratuitas para empresas
- Free UI Components
- Plantillas
- Colecciones de plantillas
- Ejemplos de webs
- Guías
- Comparativas
- Alternativas
- Los mejores
- Reseñas
- Guías de precios
- Casos de uso
- Glosario y guías
- Integraciones
- Desarrolladores
- Benchmark
- Windows App