> ## Documentation Index
> Fetch the complete documentation index at: https://help.kajabi.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Usar una Google Font en un sitio con Premier

> Aprende a agregar una Google Font a tu página con la plantilla legada, Premier.

Las Google Fonts se pueden agregar a plantillas de Website, plantillas de Course y plantillas de Landing Page. Aprende a agregar una Google Font a tu página con la plantilla legada, Premier.

<Note>
  **Nota:** Este artículo se refiere a las Plantillas Legadas de Premier, que pueden estar desactualizadas. Si usas las Plantillas de Kajabi Pages, consulta la guía actualizada [aquí](../../website/pages/how-to-embed-custom-fonts-to-your-page).
</Note>

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/vrfy03rneb" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

***

<Note>
  **Nota:** Agregar Google Fonts a tu sitio con la plantilla Premier requiere acceso al Editor de código disponible con el Plan Pro. Aprende más sobre nuestros diferentes planes en [kajabi.com/pricing](https://kajabi.com/pricing/).
</Note>

Aprende a [agregar Google Fonts a Kajabi Pages](../../website/pages/how-to-embed-custom-fonts-to-your-page) sin acceder al Editor de código.

***

## Paso 1. Haz clic aquí para elegir una Google Font

* Encuentra y copia el nombre exacto de la Google Font que deseas usar en tu sitio. Lo necesitarás en un momento. Por ejemplo:

<img src="https://mintlify.s3.us-west-1.amazonaws.com/kajabi-support/es/articles/images/002bfedc_10031285262875.png" alt="Choose a Google Font" />

***

## Paso 2. Agrega tu Google Font al código de tu sitio

Ve a tu cuenta de Kajabi y abre el Editor de código para la página donde deseas agregar tu Google Font.

[Aprende a acceder al Editor de código.](../../website/pages/how-to-access-the-code-editor)

<Warning>
  **Importante:** Agregar código personalizado a tu sitio puede exponerte a vulnerabilidades y posibles ataques de malware. Te recomendamos usar herramientas de detección de vulnerabilidades como [VirusTotal](https://www.virustotal.com/gui/home/url) o [Snyk](https://snyk.io/) para escanear cualquier código personalizado que planees usar, y aplicar ciertas [mejores prácticas](../../website/domains/code-based-customizations) para ayudar a reducir el impacto potencial.
</Warning>

En el Editor de código de tu página:

* Abre la carpeta `config`.
* Abre el archivo `settings_schema.json`.
* Localiza `"name": "Typography"` cerca de la **línea 29:**

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/d8qq8hv61k" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

<Note>
  **Nota:** Los números de línea pueden ser diferentes según tu configuración actual.
</Note>

* Encuentra los corchetes para ingresar "options" cerca de las **líneas 59** y **77**:

<img src="https://mintlify.s3.us-west-1.amazonaws.com/kajabi-support/es/articles/images/fd830933_10032670503323.png" alt="Options Input Brackets" />

Agregar tu fuente a **Base Font Family** la agregará como opción para el texto de párrafo normal en tu sitio.

Agregar tu fuente a **Heading Font Family** la agregará como opción para el texto de encabezado en tu sitio.

Si deseas agregar tu fuente como opción para todos tus elementos de párrafo y encabezado, asegúrate de completar los siguientes pasos en ambos lugares.

* Luego, coloca tu cursor entre los corchetes "options" y agrega llaves que contengan el nombre de tu fuente exactamente como se muestra abajo, reemplazando **Name of Google Font** con el nombre de la Google Font que elegiste:

`{"label": "Name of Google Font", "value": "Name of Google Font"}`

<img src="https://mintlify.s3.us-west-1.amazonaws.com/kajabi-support/es/articles/images/0f38f6de_10033765586843.png" alt="Add Google Font to Options Code" />

* Haz clic en **Save**, luego haz clic en **Customize**:

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/tj2kyfc5bp" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>

***

## Paso 3. Selecciona tu Google Font en el editor de páginas

* Haz clic en **Settings** en el editor lateral izquierdo.
* Luego, selecciona **Typography**.
* Elige tu Google Font en los menús desplegables de Heading Font Family y/o Base Font Family (aparecerá en la parte superior de la lista).
* Haz clic en **Save** para aplicar y guardar tus cambios:

<div className="w-full aspect-video">
  <iframe src="https://fast.wistia.net/embed/iframe/3n477hkuuk" allow="autoplay; fullscreen" allowFullScreen className="w-full h-full" />
</div>
