> ## 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.

# Use a Google Font on a site with Premier

> Learn to add a Google Font to your page with the Legacy Template, Premier.

Google Fonts can be added to Website Templates, Course Templates, and Landing Page Templates. Learn to add a Google Font to your page with the Legacy Template, Premier.

<Note>
  **Note:** This article refers to the Premier Legacy Templates, which may be outdated! If you're using the Kajabi Pages Templates, please refer to the updated guide [here](../../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>
  **Note:** Adding Google Fonts to your site with the Premier Template requires access to the Code Editor available with the Pro Plan. Learn more about our different plans at [kajabi.com/pricing](https://kajabi.com/pricing/).
</Note>

Learn to [add Google Fonts to Kajabi Pages](../../website/pages/how-to-embed-custom-fonts-to-your-page) without accessing the Code Editor.

***

## Step 1. Click here to choose a Google Font

* Find and copy the exact name of the Google Font you wish to use on your site. You'll need it in just a moment. For example:

<img src="https://mintcdn.com/kajabi-support/6C2WUJiFcENaSgpZ/articles/images/002bfedc_10031285262875.png?fit=max&auto=format&n=6C2WUJiFcENaSgpZ&q=85&s=19d9cce6956efd18d822c431a5d43bf4" alt="Choose a Google Font" width="1913" height="1073" data-path="articles/images/002bfedc_10031285262875.png" />

***

## Step 2. Add your Google Font to your site code

Navigate to your Kajabi account and open the Code Editor for the page where you wish to add your Google Font.

[Learn to access the Code Editor.](../../website/pages/how-to-access-the-code-editor)

<Warning>
  **Important:** Introducing custom code to your site can open you up to vulnerabilities and potential malware attacks. We recommend using vulnerability tools like [VirusTotal](https://www.virustotal.com/gui/home/url) or [Snyk](https://snyk.io/) to scan any custom code that you intend to use and apply certain [best practices](../../website/domains/code-based-customizations) to help reduce potential impact.
</Warning>

In the Code Editor for your Page:

* Open the `config` folder.
* Open the `settings_schema.json` file.
* Locate `"name": "Typography"` near **line 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>
  **Note:** The line numbers may be different depending on your current settings.
</Note>

* Find the square brackets to input "options" near **lines 59** and **77**:

<img src="https://mintcdn.com/kajabi-support/fIOZvo-6lVf3a0o9/articles/images/fd830933_10032670503323.png?fit=max&auto=format&n=fIOZvo-6lVf3a0o9&q=85&s=3368d5c7c4fb995e254903bc3cd6b75e" alt="Options Input Brackets" width="1358" height="870" data-path="articles/images/fd830933_10032670503323.png" />

Adding your font to the **Base Font Family** will add your font as an option for the normal paragraph text on your site.

Adding your font to the **Heading Font Family** will add your font as an option for the heading text on your site.

If you'd like to add your font as an option for all of your paragraph and heading elements, make sure to complete the following steps in both places.

* Next, place your cursor in between the square "options" brackets and add curly brackets containing the name of your font exactly as shown below, replacing **Name of Google Font** with the name of your chosen Google Font:

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

<img src="https://mintcdn.com/kajabi-support/CAw_ZGr15nGGoiQk/articles/images/0f38f6de_10033765586843.png?fit=max&auto=format&n=CAw_ZGr15nGGoiQk&q=85&s=0d2775169ed0d74030f50a26b60a4fad" alt="Add Google Font to Options Code" width="1363" height="650" data-path="articles/images/0f38f6de_10033765586843.png" />

* Click **Save,** then click **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>

***

## Step 3. Select your Google Font in the Page Editor

* Click **Settings** in the left sidebar editor.
* Then, select **Typography**.
* Choose your Google Font from the Heading Font Family and/or Base Font Family dropdown menus (it will appear at the top of the list).
* Click **Save** to apply and keep your changes:

<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>