How to add Google Fonts to your publication site

When using the Website Builder to design your publication site, you can add more Google Fonts to create additional options for your text. In order to do this, you’ll need to first pick the Google Font to use so you can copy its URL.

  1. Go to Google Fonts and select a font to be added to your beehiiv website. Open the selected font page and copy its URL.  
    Ex: https://fonts.google.com/specimen/Freeman 

  2. Log into your beehiiv account and from the left hand panel, click on Website Builder.



  3. The Website Builder will open on the Styles tab, scroll down and open the Typography section, or the place in the Builder that you would like to add the font to.



  4. Click the arrow next to a font name to reveal the menu options, then scroll down and select + Add Google Font.

  5. A popup form will appear for you to paste the URL of the new Google Font you want to add. Make sure to enter the URL exactly, as Google Fonts are case-sensitive, then click inside the popup box to preview the text with the new font. Click on Add Google Font to confirm.



  6. After adding a new font, you’ll receive a quick ‘Saved’ message at the top of your screen, but you’ll still need to publish the change in order to see it live.

    Click on Publish Styles while on the Styles tab in the top right corner of the Web Builder.



  7. You will receive a quick 'Published' message at the top of your screen. You can now use the newly added Google Font in the section you added it to.

 

Tech Note: Added Google Fonts are only accessible within specific sections of the Website Builder, requiring separate additions for different areas. Additionally, only one style of Google Font per font is available currently, meaning font weight and italics cannot be adjusted.

 

Was this article helpful?