Hi,

You can change fonts in the design panel. When you're logged into your concrete5 website, click on the cog or gear icon (top left toolbar) and then click on design. Then click on Customise under the Salix thumbnail. You can choose different fonts where it says "text" ."handwritten text" "heading 1" etc.

If you want to add more / different Google Fonts to Salix theme, please follow the instructions below (choose whichever fonts and font styles you want):

1. Change the defaults.less file located here (or another colour less file if you are not using the default colour scheme):

salix\themes\salix\css\build\fonts\


This is where you need to import whichever font you want to use here. Google Fonts will provide the information that you need http://fonts.google.com/. If you are not going to use one font, then delete it. Or if you want to keep all of them, but just add another font, then just add in the new font you want.

For example, if you wanted to add Open Sans, you would add this to the defaults.less file:



2. Then change defaults.less file located here (or another colour less file if you are not using the default colour scheme):

salix\themes\salix\css\presets

In this file, you need to replace the fonts that you want as per Google Font's instructions, e.g. do a find and replace for the font that you don't want to use and substitute with 'Open Sans', sans-serif;

Upload both files to your server. Save the modified files elsewhere so that you can keep them to upload again if you ever update Salix theme, as changes will be overwritten with theme upgrades. By the way, you can also create your own named preset if you prefer, e.g. custom.less. Just copy the defaults.less files in both locations, name them both custom.less and make the changes you need. Then you would select custom in the design panel.

Thanks,

Jennifer

I edited both less files (I am using redless for now). I added this in the build\fonts:



I edited all headings and menu items with Fira Sans as per Google directions in the \presets.

It appears that it is not loading and reverting to Sans Serif, the backup font. I tried emptying cache and reloading and also making sure automated jobs were complete.

Am I missing something?
Also, thanks much for your help with original message.

Hi,

Looking at the CSS on your website, I can see that the Fira font is being imported, but I don’t see the Fira font style used anywhere in the CSS. Please double check that you have included the Fira font in the correct less file (i.e. red.less in the folder salix\themes\salix\css\presets) and that this modified file has been uploaded to your server.

e.g. if you wanted to change heading 1 to Fira, you would use:



Also, you will need to check that you have imported the correct font weight and style to use. In the red.less file there is no option for changing the font weight, so you should either use the font weights of the existing fonts you are replacing, or change the font weights in the CSS files. If you are replacing Montserrat font, then you would need to select a font with 400 and 700 weight. If you need to change the font weights in the CSS files, please edit them in the appropriate CSS files here salix\themes\salix\css\build , headings are in miscellaneous.less and menu is in topmenu.less

If you have checked this, and the font still isn’t showing, it may be that the CSS hasn’t compiled with the changes. Sometimes you have to select a different colour in the design panel and save it, then choose your colour (i.e. red), in order to get the changes to show. Styles can get cached and this seems to do the trick.

Thanks, Jennifer

I should mention, if you do find you need to switch the colours in the design panel (last paragraph above) in order to get the styles to show, make a note of any changes you have made previously (if any) to the default style settings. When you change the colour in the design panel, it will lose any changes made there and revert to the original style settings.

Best, Jennifer

Got it working. thanks for the help and great info.

Thanks for letting us know :) Jennifer