Google Font Display In Safari

Hi there,

how have you added the Inter font ? I am only see the 400 weight variant being loaded on the site, which is why the browsers render the 700 weight differently ie. Chrome and FF are creating a faux bold variant.

Hi,

I put the following in functions.php and pulled the font-weight in the Typography menu within Customization.

add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' );
function tu_add_google_fonts( $fonts ) {
    $fonts[ 'Inter' ] = array( 
        'name' => 'Inter',
        'variants' => array( '400', '600', '800' ),
        'category' => 'sans-serif'
    );

    return $fonts;
}

Inter is a variable font which uses the CSS2 loading method from google fonts, which isn't supported by the current GP Typography system.

If you want to load the variable fonts then hook this link into the wp_head:

<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800" rel="stylesheet">

Which will call the font with the 3 x weights you set embedded in the single font request.

Ah ok. I wasn't aware of it.

Now it works fine. Thank you!

Glad to hear that!

Marked as resolved.