Load CSS 2 Google Fonts In Genesis Child Themes

Google Fonts now fully supports variable fonts in the CSS v2 API update. Let’s look at how to modify the PHP code in your Genesis child theme in order to load both single and multiple Google font families.

Assuming you’re using the Genesis Sample child theme by StudioPress, go to wp-content > themes > genesis-sample > config > appearance.php and look for this line of code around line 30 :

You can now change the line of code like this to load another font family using CSS2 :

If you want to load multiple Google font families, modify the code like this :

Older Genesis Child Themes

You can also use wp_enqueue_scripts to load your Google fonts by adding PHP code like this to the end of your child themes functions file.

add_action( 'wp_enqueue_scripts', 'google_fonts_enqueue_scripts_styles' );
function google_fonts_enqueue_scripts_styles() {

wp_enqueue_style( 'genesis-google-fonts', '//fonts.googleapis.com/css2?family=Crimson+Pro&display=swap', array(), genesis_get_theme_version() );

}

Tested using versions 2.2.3 and 3.4.1 of the Genesis Sample child theme by StudioPress.

You can then modify the value for your font-family property using your new fonts and you might also need to clear caching.