Setting the default font for the site

Hi,

How do I set the current fonts used as Headings & Body in my site to be the default fonts?

I am using a great performance plugin called Rabbit loader that lazy loads the fonts as part of its technique for increasing site speed. The problem is that when set to lazy load the font sometimes appears to “jump” from the site’s default font to the google fonts I am using for Header & Body.

Thanks,
Darren.

Hey Darren,

I’m not sure what you mean by default font, because what you see before the font is loaded is a system font. You can select a System Font in Theme Options > Typography.

image

Since system fonts are available on the computer itself, you won’t see that flash of unstyled text. The only downside to that is that your text will not look as nice as Google Fonts.

You might need to configure the text elements individually if you’ve used the Font Manager.

Hope that helps.

Hi Christian,

Ahh ok, I see. I thought perhaps that wordpress sites came with a default font that was used a a backup in case the custom fonts loaded through CSS failed. I thought it was loaded first and replaced with any custom fonts found in CSS.

So unless I use one of the system fonts there is no way to stop the flash if I want the benefits of Lazy Loading Fonts?

Hey @DesignMunky,

Yes, that is correct. FOUT or Flash Of Unstyled Text is a web development problem in general. You can even see it in famouse sites. There are solutions, but they require custom development which only our Elite team could do.

Thank you for understanding.

No problem Christian, thanks for the explanation. Most customers are ok with the benefits of lazy loading fonts over the brief flash when switching from system to loaded font, so I’ll just leave it for now.

Cheers,
Darren.

Hi Darren,

You are most welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.