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

Adobe Fonts (anteriormente Typekit) es un servicio que ofrece una biblioteca de fuentes de alta calidad. Mediante nuestra integración, puedes seleccionar de entre más de 1000 fuentes de Adobe Fonts para tu sitio. También puedes agregar una fuente personalizada para tu sitio. 

Seleccionar de nuestras fuentes de Adobe Fonts

Encuentra nuestras fuentes integradas de Adobe Fonts en Estilos del sitio. 

En el Menú de Inicio, haz clic en Diseño y, luego, en Estilos del sitio. Sigue los pasos descritos en Cambiar fuentes para encontrar los ajustes de Fuente o Tipografía

Los menús de fuentes en Estilos del sitio incluyen todas las opciones de fuentes disponibles. Desplázate hacia abajo para explorar nuestra biblioteca completa o usa el campo búsqueda del menú para buscar una fuente en particular. 

Consejo: Si no tienes una fuente en mente, usa la herramienta de Adobe para buscar fuentes y obtener una vista previa. Una vez que hayas encontrado una fuente de Adobe Fonts que te guste, búscala por nombre en Squarespace.

search_fonts.png

Cómo agregar fuentes personalizadas a Squarespace

Para agregar fuentes personalizadas de Adobe Fonts a tu sitio, usa los pasos que siguen. Este proceso reemplaza las opciones de Adobe Fonts en los menúes de Estilos del sitio con las fuentes de tu proyecto personalizado. Las fuentes de Adobe Fonts de Squarespace seguirán apareciendo como opciones, pero no estarán disponibles para su uso mientras estén activas tus fuentes personalizadas de Adobe Fonts. 

Nota: Las fuentes personalizadas están disponibles con la suscripción a Adobe Creative Cloud. Antes de suscribirte, elige un plan que incluya a Adobe Fonts. 

Paso 1: Crea un proyecto web y agrega las fuentes

Para agregar tus fuentes personalizadas a Squarespace, primero deberás crear un proyecto web (antes conocido como "kit") en Adobe:

  1. Inicia sesión en tu cuenta de Adobe Fonts y, a continuación, haz clic en Buscar fuentes, en la esquina superior izquierda.

browse_fonts.jpg

  1. Deslízate hacia abajo para navegar por todas las fuentes o agrega filtros para revisar la lista.
  2. Para guardar una fuente, haz clic en </>.

choose_a_font.jpg

  1. En la ventana que aparece, selecciona Crear un proyecto nuevo en el menú desplegable. Si este es tu primer proyecto web, haz clic en Aceptar para empezar.
  2. Ingresa un nombre para tu proyecto, luego selecciona todos los pesos y los estilos de la fuente que desees usar.
  3. Haz clic en Crear.
  4. Confirma que todo sea correcto y, luego, haz clic en Listo.

Para agregar más fuentes a este proyecto, repite los pasos anteriores y elige el proyecto web existente del menú desplegable.

Nota: Después de crear tu proyecto web, verás tu código para insertar HTML personalizado. No lo necesitarás, así que no lo agregues a tu sitio. En su lugar, usarás el siguiente paso para obtener el ID del proyecto web, que es un conjunto de letras y números más corto.

Paso 2: Agrega tus fuentes personalizadas a Squarespace

Una vez que tu proyecto web incluya todas las fuentes que necesitas, agrega el proyecto a tu sitio de Squarespace usando el ID del proyecto.

  1. En tu cuenta de Adobe Fonts, haz clic en Mis fuentes de Adobe Fonts en la esquina superior derecha. 

click_my_fonts.jpg

  1. Haz clic en Proyectos web y, a continuación, busca el proyecto que deseas agregar a Squarespace.
  2. Copia el ID del proyecto, que es una cadena de letras y números, arriba del código para insertar.

project_ID.jpg

  1. Inicia sesión en tu sitio de Squarespace. Desde el Menú de Inicio, haz clic en Configuración y, luego, haz clic en Avanzado.
  2. Haz clic en Claves de API externas.
  3. Desplázate hacia abajo hasta la casilla ID del Proyecto de Adobe Fonts.
  4. Pega el ID de proyecto que copiaste de Adobe en la casilla.
  5. Haz clic en Guardar.

adobe_fonts_project_ID_field.jpg

Paso 3: Usa tus fuentes de Adobe Fonts

Después de agregar las fuentes de Adobe Fonts, podrás aplicarlas al texto en tu sitio. Las fuentes de tu proyecto web reemplazan las fuentes integradas de Adobe Fonts en Estilos del sitio.

Para encontrar rápidamente una fuente personalizada de Adobe Fonts, búscala por su nombre en la casilla Buscar .

Cómo administrar los cambios en tus fuentes

  • Si cambias tus fuentes de Adobe Fonts, vuelve a publicar para que aparezcan estos cambios en Squarespace. En caso de que desees informarte mejor, visita la documentación de Adobe.
  • Aunque Adobe Fonts elimine una fuente que estás usando de su colección, la fuente seguirá cargándose en tu sitio. No obstante, no podrás aplicarla a texto nuevo o volver a usarla si la cambias, porque ya no aparecerá en Estilos del sitio.

Resolución de problemas

Veo un mensaje de "Fuentes no admitidas" en mis Estilos del sitio.

Verás este mensaje si tu sitio usa una fuente que Adobe Fonts ha quitado. Cuando la fuente ya no sea compatible, la reemplazaremos en Squarespace con la opción disponible más parecida. Revisa las secciones de estilo que se enumeran en el error para aprobar o cambiar la fuente de reemplazo.

Adobe Fonts también eliminará las fuentes que quites de tu página de Adobe Fonts.

No aparecen mis fuentes de Adobe Fonts personalizadas en mi sitio

Si no aparece ninguna de tus fuentes, revisa si tu sitio contiene JavaScript. Si alguna vez usaste el método JavaScript de Adobe Fonts para agregar fuentes a tu sitio, tus fuentes podrían no cargarse adecuadamente. Quita el JavaScript y sigue los pasos anteriores para agregar tus fuentes de Adobe Fonts. 

My font is hard to read on mobile devices

Font weights below 100 may look very light or dim on smaller mobile devices. To keep your text visible on all devices, open Site Styles and ensure the font weight is higher than 100.

Dónde obtener soporte técnico

Si tienes dificultades para agregar tu ID de proyecto de Adobe Fonts o si no aparecen las fuentes de Adobe Fonts en tu sitio, contáctanos y te ayudaremos a resolver tus problemas. Para todas las demás preguntas sobre cómo usar las fuentes de Adobe Fonts, comunícate con ellos o lee su documentación.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 40 de 135