Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 22, 2023 at 6:12 pm #1416879
    zimbo

    Lighthouse was giving me a Performance error of “Ensure text remains visible during webfont load”

    So I have this in my child functions.php to preload the fonts:

    add_action('wp_head', 'preloadfonts');
function preloadfonts(){
echo '<link rel="preload" as="font" href="https://www.henleyherald.com/wp-content/themes/enfold/config-templatebuilder/avia-template-builder/assets/fonts/entypo-fontello.woff2" type="font/woff2" crossorigin>';
echo '<link rel="preload" as="font" href="https://www.henleyherald.com/wp-content/plugins/weather-atlas/public/font/weather-icons/weathericons-regular-webfont.woff2" type="font/woff2" crossorigin>';}

    The second echo is still causing the error but I can’t see anything wrong with the code. The URL is definitely correct.

    Any ideas why it might not be working?

    August 23, 2023 at 8:10 am #1416914
    Ismael

    Hey zimbo,

    Thank you for the inquiry.

    Which element(s) are you applying the fonts to? You might need to modify the “font-display” property of those elements to “swap” to ensure that the text remains visible while the font sources are loading.

    // https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display

    Best regards,
    Ismael

    August 31, 2023 at 4:48 pm #1417704
    zimbo

    Thanks, that worked. Added it to the CSS of the plugin using the font, Performance score on the site is now 99 for Desktop… :-)

    September 1, 2023 at 11:19 am #1417775
    Ismael

    Hi,

    No problem. Glad to know that the solution improved the overall score of the site. Let us know when you have more questions about the theme.

    Have a nice day.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Preload fonts’ is closed to new replies.