Customizing Your Sites Fonts

Summary: This guide explains how to select fonts from the Google Fonts library and utilize the advanced settings in Sites to fine-tune font properties (weight, size, line height, and letter spacing) for different text styles across your website (e.g., Heading 1, Body 1).


Before You Begin

  • You must have Admin permissions to access Sites > Design settings.
  • It is helpful to visit Google Fonts beforehand to find your preferred font choices.

Step-by-Step Instructions

Sites Fonts.gif

1.  Click on Sites from your main navigation menu.

2.  Select Design, and then Fonts from the left menu.     

3.  Select fonts from the dropdowns for Font Option 1 and Font Option 2. [Hover over options to preview the font style.]

4.  Scroll down the page and Click Edit on the different styles you want to update (e.g., Heading 1, Subheading 2).

5.  Select the desired font from Font Option 1 or 2.

6.  Enter your values for Weight, Size, Line Height, and Letter spacing. [The preview on the right will reflect your changes.]

7.  Click Save Settings (or similar) to apply the changes.


Troubleshooting & FAQs

  • How do I know which setting (e.g., Heading 2) affects which part of my site? Use your browser's Inspect tool. Right-click on the section of interest, Select Inspect, and use the Select an element... tool to hover over the section; a pop-up widget will reveal the associated tag (e.g., Heading 2).
  • The font I want isn't showing up: Ensure the font you are searching for is available within the Google Fonts library, as Sites only pulls from this source.