I want to use custom Google Fonts, how do I install them on my NationBuilder website?
Google Fonts are an amazing free resource for web designers. They are easy to use, easy to install, and make websites look great. Below we walk you through this installation method and how it works with NationBuilder.
Installing Google Fonts
Go to Google Fonts and choose your font. For this example I am selecting the font called Oswald.
Click on "Quick Use" icon, as shown above highlighted in red.
Your Google font is now installed! In order for you to be able to see it on your website, you need to edit your theme.scss file and designate the styles you want to use the new font.
Go to Websites > Theme > theme.scss and add "font-family: 'Oswald', sans-serif;" to your styles.
Do this by locating your “headline”, “main”, and “nav” fonts and enter the new font family information. In this theme, the “headline”, “main”, and “nav” fonts are located on lines 11, 14, and 17 respectively.
Save and publish after finalizing your changes.
These three locations are where the main font declarations are made. Note that depending on your theme, font declarations may be made in other locations and should be updated similarly.