Replacing Google Fonts with Web Safe Fonts Manually In Escutcheon

Hi @nocturnum – you can dequeue Google Fonts either manually in a child theme, or using a plugin like:

https://www.ads-software.com/plugins/remove-google-fonts-references/

Since you describe yourself as a noob, the plugin route might be easier. ??

And to be a bit more specific, overriding your font families in the CSS file is not enough to prevent the Google Fonts from loading on your site, since the font files get called into the head of each of your pages. Additional work is needed to detach (dequeue) them from your site — that’s where the plugin comes into play.

Hi Kathryn,

Thank you very much for your replies.

I’ve already looked at the plugin that you linked, but unfortunately it isn’t tested with the current version of WordPress, 4.8.3.

While I’m definitely a noob, I’ve done sufficient online research at this point to not be afraid of editing php files, as long as I know where to look to do the editing. (And if I break anything, I know that I can always restore the child file from the parent. ?? )

Are the files that I would need to alter to detach/dequeue Google Fonts all included in Escutcheon’s theme package? Or are there also files within the underlying WP package that need to be altered as well?

Would you, or someone else, be kind enough to tell me which files I need to edit, and what specific lines of php I need to alter?

Thank you very much again for your time! ??

I found this message https://www.ads-software.com/support/topic/remove-google-font/ by djsteveb who was also looking to remove Google Fonts from his WP site using the Iconic One theme, which led me to look at my Escutcheon functions.php file, and discovered this:

/**
 * Register Google Fonts
 */
function escutcheon_fonts_url() {
	
	$fonts_url = '';

	/* Translators: If there are characters in your language that are not
	 * supported by Oswald, translate this to 'off'. Do not translate
	 * into your own language.
	 */
	$oswald = esc_html_x( 'on', 'Oswald font: on or off', 'escutcheon' );

	/* Translators: If there are characters in your language that are not
	 * supported by Alegreya Sans, translate this to 'off'. Do not translate
	 * into your own language.
	 */
	$alegreyasans = esc_html_x( 'on', 'Alegreya Sans font: on or off', 'escutcheon' );

	if ( 'off' !== $oswald || 'off' !== $alegreyasans ) {
		$font_families = array();

		if ( 'off' !== $oswald ) {
			$font_families[] = 'Oswald:400,300,700';
		}

		if ( 'off' !== $alegreyasans ) {
			$font_families[] = 'Alegreya Sans:400,400italic,700,700italic';
		}

		$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 $fonts_url;

}

I assume that editing this section of code is essential to stop Google Fonts from loading on my site? Where specifically, and how please?

And are there other files that I would need to edit as well?

Any input is greatly appreciated! ??

Arrrg…sorry. The snippet above is obviously from my parent’s functions.php file. Here is the entirety of the child functions.php code:

<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:

if ( !function_exists( 'chld_thm_cfg_parent_css' ) ):
    function chld_thm_cfg_parent_css() {
        wp_enqueue_style( 'chld_thm_cfg_parent', trailingslashit( get_template_directory_uri() ) . 'style.css', array(  ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'chld_thm_cfg_parent_css', 10 );

// END ENQUEUE PARENT ACTION

Apologies for my general noob-ness. Thank you again for your time to anyone out there still patiently following my ranting… ??

After a thorough search of all of the WP files on my hosting site, it appears that Escutcheon does not come packaged with a fonts style sheet, but rather just links directly to Google Fonts via functions.php; please see my message before last above.

Modifying a hack that I found on https://technumero.com/remove-google-fonts-from-wordpress-theme/, would this addition work to detach/dequeue Google Fonts if added to my child functions.php file (original code in my last message):

<?php
// Exit if accessed directly
if ( !defined( 'ABSPATH' ) ) exit;

// BEGIN ENQUEUE PARENT ACTION
// AUTO GENERATED - Do not modify or remove comment markers above or below:

if ( !function_exists( 'chld_thm_cfg_parent_css' ) ):
    function chld_thm_cfg_parent_css() {
        wp_enqueue_style( 'chld_thm_cfg_parent', trailingslashit( get_template_directory_uri() ) . 'style.css', array(  ) );
    }
endif;
add_action( 'wp_enqueue_scripts', 'chld_thm_cfg_parent_css', 10 );

//* TN Dequeue Styles - Remove Google Fonts from Escutcheon Theme
add_action( 'wp_print_styles', 'tn_dequeue_escutcheon_fonts_url()' );
function tn_dequeue_escutcheon_fonts_url() {
      wp_dequeue_url( 'https://fonts.googleapis.com/css' );
}

// END ENQUEUE PARENT ACTION

???

??

I traded emails with an advanced WP user about this, and the individual I did so with suggested that adding Google Fonts dequeueing to my child functions.php file might not be sufficient to stop the Google Fonts server call being triggered by the parent functions.php file. If this is the case, then wouldn’t someone in my situation be forced to edit the parent functions.php file directly, and then do so with every theme update?

Does anyone have any thoughts about this please?

I still haven’t tested my proposed dequeueing code above, as I was hoping for some feedback on it.

Any comments or thoughts you might have would be most welcome; thank you! ??

I found the answer on Stack Exchange: https://wordpress.stackexchange.com/questions/286306/will-dequeueing-in-child-theme-functions-php-file-prevent-google-fonts-from-load

Per Developer Nathan Johnson:

“Dequeueing the enqueued style will be sufficient. But you need to be careful to dequeue it after it is enqueued. It is enqueued at the default priority of 10, so make sure that when you hook into wp_enqueue_scripts you do so at a higher/later priority.”

To Escutcheon Child functions.php, insert after:

add_action( 'wp_enqueue_scripts', 'chld_thm_cfg_parent_css', 10 );

his recommended code addition (breadcrumb comment added by me):

// DEQUEUE GOOGLE FONTS

add_action( 'wp_enqueue_scripts', 'wpse_escutcheon_scripts', 11 );
	function wpse_escutcheon_scripts() {
		wp_dequeue_style( 'escutcheon-fonts' );
	}

…and voilà…back to good old fashioned Web Safe Fonts. A search of the source code of any page on my site ( [Command]+[U] in Firefox 57) returns no matches for ‘escutcheon-fonts-css’ or ‘fonts.googleapis.com’.

Now, if I can just grope my way through my next lesson in Klingon… ??

Glad you’re all sorted, and thanks for sharing your thought process and what you ended up with!

Good luck with the Klingon. ??