WING(Affinger5)で不要なWEBフォントを読み込ませないようにする方法

WING(Affinger5)で不要なWEBフォントを読み込ませないようにする方法のアイキャッチ画像

WING(Affinger5)ではWEBフォント(Google Fonts)の使用を選択できますが、使っていなくても裏で読み込みが行われています。

使っていないWEBフォントが読み込まれると、サイトの表示速度が遅くなるだけです。

今回はこれを削除する方法を紹介します。

親テーマには手を加えず、子テーマのカスタマイズだけでOKです。

バージョン・注意事項

WING(Affinger5)のバージョン: 20181120

テストは行なっていますが、何か問題が起きても責任は負いかねます。

自己責任でお願いいたします。

設定を変更する

まずは、フォントの設定を見てみましょう。

「Noto Sans」と「Rounded M+ 1c」がGoogle Fontsから読み込まれるフォントです。これは使用しない方が、サイトの速度が速くなります。

「游ゴシック」はPCに入っているシステムフォントなので、こちらでも大丈夫です。

私は全体を「デフォルト」、記事タイトル・見出し(h2~3)・ウィジェットボタンなどを「使用しない」を選択しています。

子テーマにコードを追加する

子テーマの「functions.php」に以下のコードを追加します。

念のために、functions.phpのバックアップは取っておきましょう。

// Google Fontsを読み込まない設定
function deregister_styles_google_fonts() {

  wp_deregister_style( 'fonts-googleapis-roundedmplus1c' );
  wp_register_style( 'fonts-googleapis-roundedmplus1c', '' );

  wp_deregister_style( 'fonts-googleapis-notosansjp' );
  wp_register_style( 'fonts-googleapis-notosansjp', '' );

  wp_deregister_style( 'fonts-googleapis-lato700' );
  wp_register_style( 'fonts-googleapis-lato700', '' );

  wp_deregister_style( 'fonts-googleapis-montserrat' );
  wp_register_style( 'fonts-googleapis-montserrat', '' );
}
add_action( 'wp_print_styles', 'deregister_styles_google_fonts' );

これで、Google Fontsの読み込みをキャンセルすることができます。

結果

設定前後のPage Speed Insightsの点数を比較しました。

モバイルの点数です。

こちらがBefore。

そしてAfter。

3点アップしましたね。設定変更とコピペでできるカスタマイズなので、やっておいて損はないでしょう。

他にもこんな記事があります。

WING(Affinger5)でスライドショーのCSSとJavaScriptを削除する方法 | NO TITLE

WING(Affinger5)でFont Awesomeアイコンを遅延読み込みさせて高速化 | NO TITLE