Font doesn’t render

I urgently need help because I can’t get Bricks to render my font correctly. I am developing my website locally (so no link).

At first, I uploaded a woff2-file via the Bricks menu, as suggested in the doc, but this lead to no success. So I thought I might as well delete this file again.

In a second step, I downloaded the appropriate Montserrat zip from Mattias Altmanns page, together with the script he provides. This makes the font appear under Design > MA Custom Fonts. So it’s there and available.

In a third step, I disabled all Google fonts in Bricks. Then I applied a Themes Style to my page. In “Typography”, there are only a few standard fonts left (and no Custom Fonts offered). Among the former, I picked Montserrat, which I thought to be the MA font which I uploaded. Yet, when I look at my site via a live link, only a fallback font appears.

Being a beginner in the field, this is very difficult. Can someone help?

You do not need a script to use locally hosted fonts. Download your from here (also Mattas Altmann tool): https://webfontloader.altmann.de/

Upload your font to Bricks.

Open a page, and Edit with Bricks.

Go to these settings.

Choose typography.

Select your font.

If the font doesn’t render, it may be worth looking at a plugin conflict. Unfortunately, to suggest more, a URL will be needed.

Thank you. I think these are the steps I tried in the beginning without success - only that I didn’t use Matthias’ file. So, just to be sure, you recommend that I upload specifically his woff2-file via the Bricks menu? These font files will (as I noticed earlier on) be stored in the media library, is this correct?

When you disabled Google Fonts and applied a theme style, you should have seen the fonts you selected.

Use his webfontloader to download the font you want.

Then you can use his code snippet if you like. I instead used his source code to create a plugin (save code as .php file, put in a .zip file and upload as a plugin):

Then upload the font folder into wp-content/uploads/fonts folder.

Should work then and you should see the fonts in your ‘Typography’ options.

Hi all, I installed a new font into …/uploads/fonts, and chose this font in Theme Styles. This works in the backend and frontend. Yet, when accessing my site online via FlyWheel, it won’t work.
BUT I guess the solution lies somewhere here (see screenshot). I do not understand this, but you probably will. So maybe there is help available …

use wpvivid to migrate your site. install wpvivid plugin its easy to use.

your localhost URLs didn’t change when you made it online :slight_smile: