Local font not rendering in editor

[Whelan]

In order to speed up load time, I used your documentation to add two Google fonts locally (https://docs.generatepress.com/article/adding-local-fonts/).

Unfortunately, now the local fonts don’t load in the editor… in Safari it reverts to Noto Serif and in Chrome it displays a different font-weight. It displays fine on the front-end – just not in the editor.

I have a few connected questions:

1. Why isn’t my specified local font loading in the editor? – despite being correctly specified in the wp-admin/post.php, see example:

   body.gutenberg-editor-page .block-editor-block-list__block, body .editor-styles-wrapper {
   font-family: "Montserrat";
   font-size: 17px;
   color: #414a4c;
   font-weight: 300;}

2. How can I specify a fall-back font (font stack) if I use the customiser to set the fonts? I can see it’s possible with Generateblocks, but I can’t find that feature in GP Premium Customiser.
3. Can I use code snippets to add a fallback font-stack to the editor css?

This is my setup:

• Fonts saved to /wp-content/fonts/ [woff & woff2]
• @font-face CSS added to Customiser (Additional CSS)
• Superfluous /* comments removed */
• PHP added via code snippets – “Run snippet everywhere”
• Server cache and browser cache cleared
• GP css cache cleared, files re-combined and external file regenerated.

What am I missing?

[David]

Hi there,

we recently been testing this plugin:

https://wordpress.org/plugins/host-webfonts-local/

Really does take the pain out of hosting fonts locally – and so far its been working great.

Maybe give that a shot

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts