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.


git-svn-id: https://develop.svn.wordpress.org/trunk@45485 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Felix Arntz 2019-05-31 10:09:39 +00:00
parent 37e745c041
commit 2264493b0d
7 changed files with 19 additions and 13 deletions

View File

@ -333,6 +333,7 @@ if ( ! function_exists( 'twentyfifteen_fonts_url' ) ) :
array(
'family' => urlencode( implode( '|', $fonts ) ),
'subset' => urlencode( $subsets ),
'display' => urlencode( 'fallback' ),
),
'https://fonts.googleapis.com/css'
);

View File

@ -296,6 +296,7 @@ function twentyfourteen_font_url() {
$query_args = array(
'family' => urlencode( 'Lato:300,400,700,900,300italic,400italic,700italic' ),
'subset' => urlencode( 'latin,latin-ext' ),
'display' => urlencode( 'fallback' ),
);
$font_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
}

View File

@ -296,6 +296,7 @@ function twentyseventeen_fonts_url() {
$query_args = array(
'family' => urlencode( implode( '|', $font_families ) ),
'subset' => urlencode( 'latin,latin-ext' ),
'display' => urlencode( 'fallback' ),
);
$fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );

View File

@ -333,6 +333,7 @@ if ( ! function_exists( 'twentysixteen_fonts_url' ) ) :
array(
'family' => urlencode( implode( '|', $fonts ) ),
'subset' => urlencode( $subsets ),
'display' => urlencode( 'fallback' ),
),
'https://fonts.googleapis.com/css'
);

View File

@ -245,6 +245,7 @@ function twentythirteen_fonts_url() {
$query_args = array(
'family' => urlencode( implode( '|', $font_families ) ),
'subset' => urlencode( 'latin,latin-ext' ),
'display' => urlencode( 'fallback' ),
);
$fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
}

View File

@ -165,8 +165,9 @@ function twentytwelve_get_font_url() {
}
$query_args = array(
'family' => 'Open+Sans:400italic,700italic,400,700',
'subset' => $subsets,
'family' => urlencode( 'Open+Sans:400italic,700italic,400,700' ),
'subset' => urlencode( $subsets ),
'display' => urlencode( 'fallback' ),
);
$font_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' );
}

View File

@ -1919,7 +1919,7 @@ function wp_default_styles( &$styles ) {
}
// Hotlink Open Sans, for now
$open_sans_font_url = "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";
$open_sans_font_url = "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets&display=fallback";
}
// Register a stylesheet for the selected admin color scheme.