How To Use Local Font In Generateblock's Container?

Hi there,

You'll have to enqueue your local font to the block editor stylesheets so Gutenberg can use it.

Check Tom's brief instruction here - https://generatepress.com/forums/topic/adding-local-font-to-generateblocks-advanced-typography/#post-1222427

Hi,

Thanks for the reply.

However i got confused of "Then add block-editor.css in your child theme, and include the @font-face CSS (and any other CSS you want to load in the editor)."

Where to add it? In the customizer > additional css?

Hi there,

in The GB Blocks > Typography settings, you will see a Field: Enter Font Name.
Type font Name in there, and make sure to switch the Google Font Toggle off.

Hi David,

I've done like what you instructed, but it seems not to work.

But if I turn on the google font, it works

Is that Font set in any of the Customizer > Typography settings ?

No. I don't set the font in typography settings.

Should I do it?

Are you using the font anywhere else on the site? As it makes sense to apply all your fonts in the Customizer.

I've set the H6 heading into Amiri font. It appears in the system stack in the typography setting (customizer), but somehow it was not showing in GB blocks.

What should I do then?

Hi there,

Is it just not showing in the editor, but is showing on the front-end?

If so, it's because the @font-face CSS you added needs to be added to the editor as well, or the editor doesn't have a font to download.

The instructions that Elvin linked to are correct: https://generatepress.com/forums/topic/adding-local-font-to-generateblocks-advanced-typography/#post-1222427

The block-editor.css CSS file should have your @font-face CSS that you added here: https://docs.generatepress.com/article/adding-local-fonts/#using-font-face

That way those fonts will be downloaded in the editor and should display.