WordPress.org

Make WordPress Core

Changeset 45485


Ignore:
Timestamp:
05/31/2019 10:09:39 AM (2 weeks ago)
Author:
flixos90
Message:

Bundled Theme: Load Google fonts with display=fallback parameter for better UX in case the font cannot be loaded.

Providing this query parameter ensures the stylesheet contains the font-display: fallback rule. This changeset also updates the Open Sans font used by core accordingly.

Props westonruter.
Fixes #47282.

Location:
trunk/src
Files:
7 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-content/themes/twentyfifteen/functions.php

    r45218 r45485  
    332332            $fonts_url = add_query_arg(
    333333                array(
    334                     'family' => urlencode( implode( '|', $fonts ) ),
    335                     'subset' => urlencode( $subsets ),
     334                    'family'  => urlencode( implode( '|', $fonts ) ),
     335                    'subset'  => urlencode( $subsets ),
     336                    'display' => urlencode( 'fallback' ),
    336337                ),
    337338                'https://fonts.googleapis.com/css'
  • trunk/src/wp-content/themes/twentyfourteen/functions.php

    r45218 r45485  
    295295    if ( 'off' !== _x( 'on', 'Lato font: on or off', 'twentyfourteen' ) ) {
    296296        $query_args = array(
    297             'family' => urlencode( 'Lato:300,400,700,900,300italic,400italic,700italic' ),
    298             'subset' => urlencode( 'latin,latin-ext' ),
     297            'family'  => urlencode( 'Lato:300,400,700,900,300italic,400italic,700italic' ),
     298            'subset'  => urlencode( 'latin,latin-ext' ),
     299            'display' => urlencode( 'fallback' ),
    299300        );
    300301        $font_url   = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
  • trunk/src/wp-content/themes/twentyseventeen/functions.php

    r45218 r45485  
    295295
    296296        $query_args = array(
    297             'family' => urlencode( implode( '|', $font_families ) ),
    298             'subset' => urlencode( 'latin,latin-ext' ),
     297            'family'  => urlencode( implode( '|', $font_families ) ),
     298            'subset'  => urlencode( 'latin,latin-ext' ),
     299            'display' => urlencode( 'fallback' ),
    299300        );
    300301
  • trunk/src/wp-content/themes/twentysixteen/functions.php

    r45218 r45485  
    332332            $fonts_url = add_query_arg(
    333333                array(
    334                     'family' => urlencode( implode( '|', $fonts ) ),
    335                     'subset' => urlencode( $subsets ),
     334                    'family'  => urlencode( implode( '|', $fonts ) ),
     335                    'subset'  => urlencode( $subsets ),
     336                    'display' => urlencode( 'fallback' ),
    336337                ),
    337338                'https://fonts.googleapis.com/css'
  • trunk/src/wp-content/themes/twentythirteen/functions.php

    r45256 r45485  
    244244
    245245        $query_args = array(
    246             'family' => urlencode( implode( '|', $font_families ) ),
    247             'subset' => urlencode( 'latin,latin-ext' ),
     246            'family'  => urlencode( implode( '|', $font_families ) ),
     247            'subset'  => urlencode( 'latin,latin-ext' ),
     248            'display' => urlencode( 'fallback' ),
    248249        );
    249250        $fonts_url  = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
  • trunk/src/wp-content/themes/twentytwelve/functions.php

    r45256 r45485  
    166166
    167167        $query_args = array(
    168             'family' => 'Open+Sans:400italic,700italic,400,700',
    169             'subset' => $subsets,
     168            'family'  => urlencode( 'Open+Sans:400italic,700italic,400,700' ),
     169            'subset'  => urlencode( $subsets ),
     170            'display' => urlencode( 'fallback' ),
    170171        );
    171172        $font_url   = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
  • trunk/src/wp-includes/script-loader.php

    r45481 r45485  
    19201920
    19211921        // Hotlink Open Sans, for now
    1922         $open_sans_font_url = "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";
     1922        $open_sans_font_url = "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets&display=fallback";
    19231923    }
    19241924
Note: See TracChangeset for help on using the changeset viewer.