Created
June 10, 2019 16:06
-
-
Save carolinan/7c2b002465b260ab3a74ec2d9b924c8c to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Things we do allow | |
The links: | |
https://fonts.googleapis.com/css | |
//fonts.googleapis.com/css | |
https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js | |
https://fonts.gstatic.com | |
The code examples: | |
Notes: | |
Examples are separated with ----. | |
We need to cover both wp_register_style and wp_enqueue_style | |
function twentyseventeen_fonts_url() { | |
$fonts_url = ''; | |
/* | |
* Translators: If there are characters in your language that are not | |
* supported by Libre Franklin, translate this to 'off'. Do not translate | |
* into your own language. | |
*/ | |
$libre_franklin = _x( 'on', 'Libre Franklin font: on or off', 'twentyseventeen' ); | |
if ( 'off' !== $libre_franklin ) { | |
$font_families = array(); | |
$font_families[] = 'Libre Franklin:300,300i,400,400i,600,600i,800,800i'; | |
$query_args = array( | |
'family' => urlencode( implode( '|', $font_families ) ), | |
'subset' => urlencode( 'latin,latin-ext' ), | |
); | |
$fonts_url = add_query_arg( $query_args, 'https://fonts.googleapis.com/css' ); | |
} | |
return esc_url_raw( $fonts_url ); | |
} | |
---- | |
function twentyseventeen_resource_hints( $urls, $relation_type ) { | |
if ( wp_style_is( 'twentyseventeen-fonts', 'queue' ) && 'preconnect' === $relation_type ) { | |
$urls[] = array( | |
'href' => 'https://fonts.gstatic.com', | |
'crossorigin', | |
); | |
} | |
return $urls; | |
} | |
---- | |
This is only a partial of a PHP file in Kirki: | |
kirki/modules/webfonts/webfonts.php | |
return array("kind" => "webfonts#webfontList", "items" => array(array("kind" => "webfonts#webfont", "family" => "ABeeZee", "category" => "sans-serif", | |
"variants" => array("regular", "italic"), "subsets" => array("latin"), | |
"version" => "v11", "lastModified" => "2017-10-10", | |
"files" => array("regular" => "http://fonts.gstatic.com/s/abeezee/v11/mE5BOuZKGln_Ex0uYKpIaw.ttf", | |
"italic" => "http://fonts.gstatic.com/s/abeezee/v11/kpplLynmYgP0YtlJA3atRw.ttf")), | |
---- | |
if ( ! function_exists( 'ot_load_google_fonts_css' ) ) { | |
function ot_load_google_fonts_css() { | |
/* don't load in the admin */ | |
if ( is_admin() ) | |
return; | |
$ot_google_fonts = get_theme_mod( 'ot_google_fonts', array() ); | |
$ot_set_google_fonts = get_theme_mod( 'ot_set_google_fonts', array() ); | |
$families = array(); | |
$subsets = array(); | |
$append = ''; | |
if ( ! empty( $ot_set_google_fonts ) ) { | |
foreach( $ot_set_google_fonts as $id => $fonts ) { | |
foreach( $fonts as $font ) { | |
// Can't find the font, bail! | |
if ( ! isset( $ot_google_fonts[$font['family']]['family'] ) ) { | |
continue; | |
} | |
// Set variants & subsets | |
if ( ! empty( $font['variants'] ) && is_array( $font['variants'] ) ) { | |
// Variants string | |
$variants = ':' . implode( ',', $font['variants'] ); | |
// Add subsets to array | |
if ( ! empty( $font['subsets'] ) && is_array( $font['subsets'] ) ) { | |
foreach( $font['subsets'] as $subset ) { | |
$subsets[] = $subset; | |
} | |
} | |
} | |
// Add family & variants to array | |
if ( isset( $variants ) ) { | |
$families[] = str_replace( ' ', '+', $ot_google_fonts[$font['family']]['family'] ) . $variants; | |
} | |
} | |
} | |
} | |
if ( ! empty( $families ) ) { | |
$families = array_unique( $families ); | |
// Append all subsets to the path, unless the only subset is latin. | |
if ( ! empty( $subsets ) ) { | |
$subsets = implode( ',', array_unique( $subsets ) ); | |
if ( $subsets != 'latin' ) { | |
$append = '&subset=' . $subsets; | |
} | |
} | |
wp_enqueue_style( 'ot-google-fonts', esc_url( '//fonts.googleapis.com/css?family=' . implode( '|', $families ) ) . $append, false, null ); | |
} | |
} | |
} | |
---- | |
wp_register_style( 'google_fonts', '//fonts.googleapis.com/css?family=Lato' ); | |
---- | |
if (!function_exists('qqq_scripts')) { | |
function qqq_scripts() { | |
wp_enqueue_style('qqq-google-fonts', 'https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,600', array(), null); | |
} | |
} | |
add_action('wp_enqueue_scripts', 'qqq_scripts'); | |
---- | |
wp_enqueue_script( | |
'webfontloader', | |
'https://ajax.googleapis.com/ajax/libs/webfont/1.5.0/webfont.js', | |
array( 'jquery' ), | |
'1.5.0', | |
true | |
); | |
---- | |
Note that this is inside a PHP file: | |
<script> | |
/* You can add more configuration options to webfontloader by previously defining the WebFontConfig with your options */ | |
if ( typeof WebFontConfig === "undefined" ) { | |
WebFontConfig = new Object(); | |
} | |
WebFontConfig['google'] = {families: [<?php echo $typography->makeGoogleWebfontString ( $this->typography ) ?>]}; | |
(function() { | |
var wf = document.createElement( 'script' ); | |
wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.5.3/webfont.js'; | |
wf.type = 'text/javascript'; | |
wf.async = 'true'; | |
var s = document.getElementsByTagName( 'script' )[0]; | |
s.parentNode.insertBefore( wf, s ); | |
})(); | |
</script> | |
---- | |
The following is a partial from a JSON file: | |
premier/inc/fonts.json | |
"files": { | |
"300": "http://fonts.gstatic.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTS3USBnSvpkopQaUR-2r7iU.ttf", | |
"300italic": "http://fonts.gstatic.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxi9-WlPSxbfiI49GsXo3q0g.ttf", | |
"regular": "http://fonts.gstatic.com/s/opensans/v10/IgZJs4-7SA1XX_edsoXWog.ttf", | |
"italic": "http://fonts.gstatic.com/s/opensans/v10/O4NhV7_qs9r9seTo7fnsVKCWcynf_cDxXwCLxiixG1c.ttf", | |
"600": "http://fonts.gstatic.com/s/opensans/v10/MTP_ySUJH_bn48VBG8sNSi3USBnSvpkopQaUR-2r7iU.ttf", | |
"600italic": "http://fonts.gstatic.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxpZ7xm-Bj30Bj2KNdXDzSZg.ttf", | |
"700": "http://fonts.gstatic.com/s/opensans/v10/k3k702ZOKiLJc3WVjuplzC3USBnSvpkopQaUR-2r7iU.ttf", | |
"700italic": "http://fonts.gstatic.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxne1Pd76Vl7zRpE7NLJQ7XU.ttf", | |
"800": "http://fonts.gstatic.com/s/opensans/v10/EInbV5DfGHOiMmvb1Xr-hi3USBnSvpkopQaUR-2r7iU.ttf", | |
"800italic": "http://fonts.gstatic.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxg89PwPrYLaRFJ-HNCU9NbA.ttf" | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment