 |
Summary | Google Fonts is a simple theme component that allows you to add a font from Google Fonts without writing any CSS. |
 |
Preview | Preview on Discourse Theme Creator |
 |
Repository Link | https://github.com/discourse/discourse-google-font-component |
 |
New to Discourse Themes? | Beginner’s guide to using Discourse Themes |
Install this theme component
Features
This component allows you to set the main site font, and optionally separate fonts for headlines and monospaced text (code blocks). You can also choose a font weight in each case, and increase the font size.
Behind the scenes this sets up a little bit of CSS along with Google’s font <link>. Note that this is relying on Google to serve the font files from https://fonts.googleapis.com/.
Settings
| Name | Description |
|---|---|
| fonts | Add the name of the font(s) you want to use from fonts.google.com. Note that font names are CaSe SeNsiTivE! |
| body font | The main font used throughout Discourse, must be included in “fonts” setting above |
| body font weight | Font thickness in the range of 100-900. 400 is normal, 700 is bold |
| headline font | Optional font for headlines, must be included in “fonts” setting above |
| headline font weight | Font thickness in the range of 100-900. 400 is normal, 700 is bold |
| monospaced font | Optional font for code blocks, must be included in “fonts” setting above. |
| monospaced font weight | Font thickness in the range of 100-900. 400 is normal, 700 is bold |
| normal font size | Default font size for all users, adjusting this will adjust all font sizes proportionately |
| smaller font size | Selectable in each user’s interface preferences |
| larger font size | Selectable in each user’s interface preferences |
| largest font size | Selectable in each user’s interface preferences |
Last edited by @awesomerobot 2025-03-14T15:46:34Z
Check document
Perform check on document: