Changing Theme Fonts

Hi @mobileste,

Glad you like it! Sure, go to Appearance → Customize → Additional CSS (the menu labels might be different in your language) and add the code below:

@import url('https://fonts.googleapis.com/css?family=Rubik:400,400i,700,700i&display=swap');
body * { font-family: Rubik, sans-serif !important; }

That piece of CSS will import the font “Rubik” from Google Fonts and force all elements on the page to use it.

You can change the font by specifying another font on Google Fonts. When viewing a font on Google Fonts, click Select this Font → @import, and replace the @import line above. If you want to change the font of only some elements, you’ll have to update to targeting to only target the elements you want to change.

— Anders

Great. This worked a treat.

Is it also possible to make the font to not display in capitals?

Kind Regards

Steve

Hi Anders,

Im also trying to get this font to display in Extra-Light

https://fonts.google.com/specimen/Raleway?selection.family=Raleway:100

It doesn’t seem to want to do it in the theme?

Thanks

Steve

Hi @mobileste,

You can set all text to be normalcase (capitalized as written) by adding the following CSS:

body * { text-transform: none !important; }

And use the extra light font weight by adding:

body * { font-weight: none !important; }

— Anders

Hi Anders,

The font is now lower case but the light front isn’t working with the code?

Thanks

Steve