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 Typekit con Squarespace

Typekit es un servicio ofrecido por Adobe que brinda una biblioteca de fuentes de alta calidad. Con nuestra integración, puedes elegir entre más de 1000 tipos integrados de fuentes Typekit para el sitio. También puedes utilizar TypeKit para añadir un kit de fuentes personalizadas al sitio.

Seleccionar una de nuestras fuentes Typekit

En el Home Menu (Menú principal), haz clic en Design (Diseño) y luego haz clic en Style Editor (Editor de Estilo). Sigue los pasos de Cambiar fuentes para encontrar los ajustes de Font (Fuente) o Typography (Tipografía) .

Los menús de fuentes en el Editor de Estilo incluyen una selección dedicada a las opciones más populares. Desplázate hacia abajo para seleccionar una fuente de la lista o usa el campo de búsqueda del menú para buscar una fuente en particular.

Consejo: Si no tienes una fuente en mente, TypeKit tiene un excelente recurso para buscar y previsualizar las fuentes aquí. Una vez que encuentres una fuente TypeKit que te guste, búscala en Squarespace.

search_fonts.png

Añadir fuentes TypeKit personalizadas

Si tienes una fuente personalizada de TypeKit, sigue estos pasos para utilizarla en tu sitio Squarespace. Ten en cuenta que seguir estos pasos sustituirá las opciones de TypeKit en los menús del Editor de Estilo con las fuentes en el kit personalizado. Las fuentes del TypeKit de Squarespace aún aparecerán como opciones, pero no estarán disponibles para usarlas mientras tengas habilitado el Typekit personalizado.

Teniendo en cuenta el número de fuentes incorporadas disponibles, es posible que sólo tengas que utilizar esta opción si tienes tu propia fuente de TypeKit.

Nota: Hay fuentes personalizadas disponibles para los Planes Portfolio y Performance de TypeKit.

Paso 1 - Crea un Kit

  1. En la cuenta de TypeKit, posiciona el cursor sobre Kits y haz clic en +Create New Kit (Crear nuevo Kit).

1.CreateNewKit.png

  1. En la ventana Create a Kit (Crear un Kit) , ingresa un nombre para el kit en la casilla Name (Nombre) .
  2. En la casilla Domains (Dominios), añade cada dominio registrado o conectado con tu sitio de Squarespace y tu dominio incorporado. Esto asegura que las fuentes siempre se mostrarán sin importar qué URL se utiliza para visitar el sitio. 
  3. Haz clic en Continue (Continuar).

2.CreateAKit.png

  1. En la ventana Add your embed code (Añadir tu código integrado), haz clic en Continue (Continuar).
Nota: Verás ventanas con código JavaScript aquí, pero no agregues este JavaScript al sitio Squarespace. Continúa el proceso hasta que hayas generado el ID del Kit de TypeKit, que es un conjunto más corto de letras y números.

Paso 2 - Añade fuentes al Kit

  1. En la ventana Typekit, haz clic en Browse all fonts (Ver todas las fuentes)

TypekitFonts.png

  1. Vuelve a la cuenta TypeKit y busca fuentes en la biblioteca de TypeKit.
  2. Selecciona una fuente y, a continuación, haz clic en <> Add to Kit (Añadir al Kit) para añadirla al kit. Cada fuente seleccionada aparecerá en el menú de fuentes en el Editor de Estilo.

5.AddToKit.png

 

Paso 3 - Publicar

  1. Después de añadir fuentes a tu kit, debes hacer clic en Publish (Publicar) para que las fuentes aparezcan en el Editor de Estilo. 

Publish.png

Paso 4 - Obtén tu ID de Typekit

  1. En la ventana Typekit, haz clic en Embed Code (Código Integrado).

  1. Copia el ID del Kit de TypeKit que aparece debajo del código JavaScript integrado predeterminado.

4.EmbedCode.png

Paso 5 - Añade el ID del Kit a Squarespace

  1. En el Home Menu (Menú Principal) de Squarespace, haz clic en Design (Diseño) y luego haz clic en Advanced (Avanzado).

Using_Typekit_with_Squarespace.png

  1. Pega el ID del Kit en la casilla TypeKit Kit ID (ID del Kit de Typekit) . Luego haz clic en Guardar) .

 

Paso 6 - Usa la fuente TypeKit

Después de añadir fuentes Typekit, las puedes aplicar al texto en el sitio. Las fuentes en el kit sustituyen a las fuentes integradas de TypeKit en el Editor de Estilo.

Para encontrar rápidamente la fuente personalizada de TypeKit, búscala por su nombre en la casilla Search (Buscar) .

Si TypeKit elimina una fuente que aparece en tu sitio, la fuente continuará cargada en tu sitio. Sin embargo, la fuente no aparecerá en la lista de fuentes de Typekit en el Editor de Estilo.

Consejo: Si cambias de TypeKit, publica nuevamente para ver estos cambios en Squarespace. Para obtener más información, consulta la documentación de TypeKit

Resolución de problemas

Veo el mensaje "Fuentes no compatibles" en mi Editor de Estilo

Verás este mensaje si tu página web usa una fuente que Typekit ha retirado. 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.

Typekit también eliminará las fuentes retiradas de tu página de fuentes sincronizadas

Mis fuentes personalizadas de Typekit no se muestran en mi página web

Si no se muestra ninguna de tus fuentes, prueba con estos dos pasos: 

  1. Comprueba cualquier JavaScript que hayas añadido a la página web. Si alguna vez utilizaste el método JavaScript de TypeKit para agregar fuentes a la página web, es posible que las fuentes no se carguen correctamente. Quita el JavaScript y sigue los pasos anteriores para añadir las fuentes TypeKit.
  2. En Typekit, asegúrate de añadir todos los dominios conectados a tu página web, incluido tu dominio incorporado (http://tusitio.squarespace.com).Las fuentes Typekit aparecen solamente cuando visitas un dominio que hayas agregado en el Paso 1 de esta guía. 

Nota: Squarespare puede ayudarte a configurar esta integración con TypeKit. Si tienes problemas para agregar el ID del Kit de TypeKit o si las fuentes de Typekit no aparecen, inicia un reclamo y te ayudaremos a solucionar los problemas. Para todas las demás preguntas sobre el uso de TypeKit, ponte en contacto con ellos en support@typekit.com o consulta su documentación.

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