[Resolved] Typeface Inter

Home Forums Support Typeface Inter

  • This topic has 18 replies, 6 voices, and was last updated 4 months ago by David.
Viewing 15 posts - 1 through 15 (of 19 total)
  • Author
    Posts
  • #1061493
    Enrico

    Hi,
    It is possibile to use the Typeface Inter in GPP?

    It is now used in WP’s Twenty Twenty Theme and they say it has many benefit. Do you think Inter should be better then System Stack?

    The typeface Inter, designed by Rasmus Andersson. The tall x-height of Inter makes it highly legible in the smallest of font sizes, and provides a strong personality when used in big headings.

    Inter comes in a Variable Font version, a first for default themes, which contains all weights and styles of Inter in just two font files. In modern browsers, this will help keep the number of requests and the page size down. Older browsers will fall back to loading each weight as a separate file. Running text will be set in a stack of serif system fonts to keep load times short and data caps distant.

    #1062118
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Looks really cool! I wonder if System Stack is still more performant, though? I’ll definitely play with it.

    You can definitely integrate it into GPP using our filters – do you need some help doing that?

    Let me know 🙂

    #1062216
    Enrico

    Hi Tom,
    I am happy that you like the suggestion of this free font project. I have seen now that with GPP’s Filters I can use any font I load on my server: https://docs.generatepress.com/article/adding-local-fonts/

    I think Inter should be more legible then System Stack but a bit slower. If you load all the font files in two files you have less requests but it shouldn’t be faster with http2.

    The variable font renders poorly in Chrome
    There are some known issues with variable fonts in Chrome, in particular on Microsoft Windows. You may see an effect similar to “ink bleed” where shapes overlap, for instance where the vertical and horizontal stems meet in “+” or “t”. On Windows you may in addition see incorrectly placed glyphs that looks like poor kerning (spacing between characters) and even some glyphs being lower or taller than other glyphs. It is recommended to avoid using variable fonts on Chrome. See the Chromium bug tracker for a list of variable-font related issues.

    Now I am testing the new GP and GPP, I will wait for your judgment and decision on the Inter font project.

    Thanks a lot
    Enrico

    #1158915
    Robin

    Tom, any update on adding Inter – It’s an awesome font.

    Cheers, Robin

    #1159293
    Tom
    Lead Developer
    Lead Developer

    It looks like it’s being added to Google fonts: https://github.com/google/fonts/pull/1908#issuecomment-580509162

    Once it’s added we’ll update our list 🙂

    #1159374
    Robin

    Thanks, Tom. Have a good weekend.

    #1159772
    Tom
    Lead Developer
    Lead Developer
    #1195294
    Paul

    Inter has now been added to Google Fonts:

    https://fonts.google.com/specimen/Inter

    Can this be added to GP?

    I did download the font but uploading is still blocked – I have added the function used to bypass security settings.

    Thanks,
    Paul.

    #1195329
    David
    Staff
    Customer Support
    #1195334
    Paul

    Thanks David, that works. Just in case anybody wants to use it:

    add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' );
    function tu_add_google_fonts( $fonts ) {
    	$fonts[ 'inter' ] = array( 
    		'name' => 'Inter',
    		'variants' => array( '100', '200', '300', '400', '500', '600', '700', '800', '900' ),
    		'category' => 'serif'
    	);
    
    	return $fonts;
    }
    #1195369
    Robin

    Thanks for that, however, I get the following error message when I add it in ‘Snippets’.

    The snippet has been deactivated due to an error on line 3:

    Cannot redeclare function tu_add_google_fonts.

    #1195375
    Enrico

    Hi David,
    I tested the Google’s Inter font performance and it is much slower then local font. I lost 3 to points in the Google page speed test. I got 96 with inter font and 99 using the local font.

    Is it possible and easy to add the Inter font locally? Do you plan to add it locally?

    In my test I used this code:

    add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' );
    function tu_add_google_fonts( $fonts ) {
    	$fonts[ 'inter' ] = array( 
    		'name' => 'Inter',
    		'variants' => array( '400', '500', '700' ),
    		'category' => 'serif'
    	);
    
    	return $fonts;
    }
    #1195384
    David
    Staff
    Customer Support

    Thanks Paul

    Robin – that means you have already used that function to add fonts to the list – you can either combine the functions or in Pauls function you will see two instances of: tu_add_google_fonts change them to something else eg. tu_add_google_fonts_two

    Enrico – now its on google you can use this topic to add it locally:
    https://docs.generatepress.com/article/adding-local-fonts/

    Haven’t tested it yet – but i expect it will behave better then trying to add the RSMS original font.

    #1195595
    Robin

    That’s great. As always, thanks, David. Stay well.

    #1195598
    David
    Staff
    Customer Support

    You’re welcome Robin – You too!

Viewing 15 posts - 1 through 15 (of 19 total)
  • You must be logged in to reply to this topic.