How to change the fonts in Learn2

Support Themes & Styling
1

Hello,

I would like to change the fonts in Learn2 to our website font. Is there an easy way to do this?

Thank you

2

Depends on what is easy for you, but yes.
Anyway, from your post it sounds you didn’t even try to achieve it. If you did, could you list the steps you took and failed?

3

Appearances can be deceptive. I added this _custom.scss

// Your custom SCSS should be written here...

// Import Google Web Fonts
@import url(//fonts.googleapis.com/css?family=Montserrat:400|IBM+Plex+Sans:300|Inconsolata);

$font-family-default:           "IBM+Plex+Sans", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
$font-family-header:            "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
$font-family-mono:              "Inconsolata", monospace;
$font-family-serif:             "Georgia", "Times", "Times New Roman", serif;

to overwrite this in _fonts.scss:

// Import Google Web Fonts
@import url(//fonts.googleapis.com/css?family=Montserrat:400|Muli:300,400|Inconsolata);

$font-family-default:           "Muli", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
$font-family-header:            "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
$font-family-mono:              "Inconsolata", monospace;
$font-family-serif:             "Georgia", "Times", "Times New Roman", serif;

I had hoped IBM Plex Sans would replace Muli, but Muli persists.

Maybe scss needs to be compiled but the documentation on that point is beyond my ken (Gantry has a Compile SCSS button).

Please advise.

4

A simple way to change the font is to edit the compiled theme css file. Not best practice but quick and easy.

OK for a stable documentation site

Thank you for pointing me in the right direction.

5

Did you recompile SCSS to CSS after editing _custom.scss?
It’s either that or you should just create a custom.css inside the /css folder.

But first of all you should extend the theme by inheriting it and use that new theme for edited CSS. Otherwise on Learn2 update you will lose your changes

6

@Karmalakas. Just edited the CSS to change the font. I will follow your advice and extend the theme. Many thanks.