0

I have a wordpress website using a custom audio theme (Promenade). I want to use my own font, so I uploaded the woff2 file to my folder and added the following code to the styles.css of the theme:

@font-face {
  font-family: "Open Sans Condensed", sans-serif;
  src: url("https://molllust.com/wp-content/themes/promenade/fonts/OpenSans-CondLight-webfont.woff2") format("woff2");
  font-style: normal;
  font-weight: 400; 
}

The font file is downloadable via the given address via browser. But the font doesn't seem to be downloaded at all. In the Chrome debugger, under Network > Fonts my font file isn't loaded. But in the same debugger, I can see the style.css is loaded with the @font-face line as it should. Other fonts seem to be loaded.

Do you have any idea, what might cause the font-file not being downloaded, though I checked the @font-face command a hundred times? The site is http://molllust.com

Thanks in advance,
Frank

1 Answer 1

1

When defining the name of your font face, you need to use only a single value for the font-family directive. So, change

font-family: "Open Sans Condensed", sans-serif;

to

font-family: "Open Sans Condensed";

With font-family in @font-face, you're defining the name of your font family. It's different from when you use font-family elsewhere in your code, where you're providing the browser with a list of suitable fonts for rendering an element.

1
  • 1
    That was it! Thanks a lot :)
    – Aaginor
    Commented Dec 16, 2023 at 23:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.