Hello @natalibarbova
I trust you’re doing well!
The code rel="preload" needs to be added to the font that is already loading in your header. This will require custom coding.
As a workaround you may try this plugin that will load Google Fonts local y and also preload these fonts:
https://wordpress.org/plugins/host-webfonts-local/
I hope this helps!
Cheers,
Nastia
Hi,
I don’t want to clutter my website with plugins if it can be helped. Where can i find the font i need to add rel="preload" ?
This is all my header shows:
<?php
/**
* The header for our theme
*
* This is the template that displays all of the <head> section and everything up until <div id="content">
*
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
*
* @package Airi
*/
?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-WBRWV7M');</script>
<!-- End Google Tag Manager -->
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="profile" href="http://gmpg.org/xfn/11">
<?php wp_head(); ?>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-122820871-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-122820871-1');
</script>
</head>
<body <?php body_class(); ?>>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WBRWV7M"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<div id="page" class="site">
<a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( 'Skip to content', 'airi' ); ?></a>
<?php $menu_layout = airi_menu_layout(); ?>
<?php get_template_part( 'template-parts/menus/menu', $menu_layout['type'] ); ?>
<div id="content" class="site-content">
<?php
if ( !is_page_template( 'page-templates/template_page-builder.php') ) {
echo '<div class="container">';
echo '<div class="row">';
}
?>
Hello @natalibarbova
I trust you’re doing well!
The font can be embedded in your header from a plugin. In a oage source of your site the following link is added:
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400%7COpen+Sans:300,400&subset=latin" media="all">
I see that your site is built with the Elementor plugin, mostly likely it is where the font is loading from. The same issue was opened on the GitHub with only solution is to load the fonts locally:
https://github.com/elementor/elementor/issues/10886
Please see here how to replace Google Font from Elementor to be loading locally:
https://squareinternet.co/hosting-google-fonts-locally-with-elementor/
I hope this helps!
Cheers,
Nastia
Hello there @natalibarbova
I hope you are doing well!
We haven’t heard back from you for a while now so we’ve marked this ticket as resolved. If you do have any followup questions or require further assistance feel free to reopen it and let us know here.
Kind regards,
Nastia