Customizing the Google Font List

As of GP Premium 1.2.90, only the top 200 most popular Google Fonts are displayed in the Customizer dropdown list.

You can add more fonts to this list, and even change the amount that displays in the list.

Showing all available Google Fonts

This filter will add all fonts that we have listed within the theme. This doesn’t include every single Google Font unfortunately, as the list is way too big (and growing).

add_filter( 'generate_number_of_fonts','tu_show_all_available_google_fonts' );
function tu_show_all_available_google_fonts() {
	return 'all';
}

Showing a different number of Google Fonts

By default, the top 200 fonts are displayed. You can change this number to whatever you like.

add_filter( 'generate_number_of_fonts','tu_show_fifty_google_fonts' );
function tu_show_fifty_google_fonts() {
	return 50;
}

Adding your Google Font to the list

add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' );
function tu_add_google_fonts( $fonts ) {
	$fonts[ 'zilla_slab' ] = array( 
		'name' => 'Zilla Slab',
		'variants' => array( '300', '300i', '400', '400i', '500', '500i', '600', '600i', '700', '700i' ),
		'category' => 'serif'
	);
	
	return $fonts;
}

The open_sans part is the full name of your font as it displays on the Google Fonts website, with all lowercase characters and spaces replaces by an underscore.

Then we have an array with the font name, an array of variants you want available, and the category.

So if you wanted to use the David Libre font and it isn’t in the list, this would be your function:

add_filter( 'generate_typography_customize_list', 'tu_add_google_fonts' );
function tu_add_google_fonts( $fonts ) {
	$fonts[ 'david_libre' ] = array( 
		'name' => 'David Libre',
		'variants' => array( '400', '500', '700' ),
		'category' => 'serif'
	);

	return $fonts;
}

Learn how to add PHP here.