Last active
January 3, 2024 20:19
-
-
Save Balachandark/3bc4abaccf1bf07fcec378d1dc59b719 to your computer and use it in GitHub Desktop.
Preload fonts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
add_filter( 'astra_enable_default_fonts', 'temp_disable_astra_fonts' ); | |
function temp_disable_astra_fonts( $load ) { | |
$load = false; | |
return $load; | |
} | |
add_action( 'wp_head', 'add_astra_fonts_preload', 1 ); | |
function add_astra_fonts_preload() { | |
?> | |
<link rel="preload" href="<?php echo get_site_url(); ?>/wp-content/themes/astra/assets/fonts/astra.woff" as="font" crossorigin /> | |
<link rel="preload" href="<?php echo get_site_url(); ?>/wp-content/themes/astra/assets/fonts/astra.ttf" as="font" crossorigin /> | |
<link rel="preload" href="<?php echo get_site_url(); ?>/wp-content/themes/astra/assets/fonts/astra.svg#astra" as="font" crossorigin /> | |
<style type='text/css'> | |
<?php | |
echo '@font-face {font-family: "Astra";src: url( ' . get_site_url() . '/wp-content/themes/astra/assets/fonts/astra.woff) format("woff"),url( ' . get_site_url() . '/wp-content/themes/astra/assets/fonts/astra.ttf) format("truetype"),url( ' . get_site_url() . '/wp-content/themes/astra/assets/fonts/astra.svg#astra) format("svg");font-weight: normal;font-style: normal;font-display: fallback;}'; | |
?> | |
</style> | |
<?php | |
} |
You need to add the code in your child theme's functions.php file
Thanks @bilici, that worked.
@bilici what are you doing for the latter error woff2 error? I'm getting an error for …webfonts/fa-solid-900.woff2. What are you doing for this?
I left the "as" in there because I got an error without but now getting:
" has an unsupported type
value" from Lighthouse|
<link rel="preload" href="<?php echo get_site_url(); ?>/wp-content/themes/astra/assets/fonts/astra.woff" as="font" type="font/woff" crossorigin />
<link rel="preload" href="<?php echo get_site_url(); ?>/wp-content/themes/astra/assets/fonts/astra.ttf" as="font" type="font/ttf" crossorigin />
<link rel="preload" href="<?php echo get_site_url(); ?>/wp-content/themes/astra/assets/fonts/astra.svg#astra" as="font" type="font/svg" crossorigin />
<style type='text/css'>
Thanks in advance!
could you please help with the code link rel preload for images? thank you very much
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
how to solve Preload problem in astra. where to upload this code.