Ensure text remains visible during webfont load (font-display swap for custom fonts)

Support
#1

Hello, how do I ensure that a default font is loaded while the following fonts are loaded:

The Futura Book and Heavy fonts are custom fonts uploaded through font manager. I tried adding the following global CSS to see if it would fix it but unfortunately, it did not:

@font-face {
font-family: “Futura”, Arial, serif;
font-display: swap;
}

URL
Potential Savings (ms)
…05/Futura-Book-1.woff2(doqq482x0xoov.cloudfront.net)
460 ms
…05/Futura-Heavy.woff2(doqq482x0xoov.cloudfront.net)
460 ms
…font_awesome/fa-solid-900.woff2(doqq482x0xoov.cloudfront.net)
460 ms
…font_awesome/fa-brands-400.woff2(doqq482x0xoov.cloudfront.net)
890 ms

#2

Hi @roman777,

You need to add the fallback font to your body and not on the fontface.

For example

body {
  font-family:  "Futura", Arial, serif;
}

For more information kindly refer to the link below

Hope that helps

#3

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