あずきです🐥
WordPressで、「ページ表示を高速化」するための代表的な手段の1つ…
Webフォント「Googleフォント」を削除する方法
について、ブログ初心者さん向けに1から解説していきます
具体的には、次の2ステップです
- 【準備】テーマ側のフォント設定を変更（「WING（AFFINGER5）」を例に解説）
- 【本題】プラグイン「Autoptimize」で、「Googleフォントの削除」を選択
さっそく見ていきましょー🐥
合わせてどーぞ♪
-
WordPressで、Webフォント「Googleフォント」の削除は実際するべきか？【サイト表示の高速化】
続きを見る
＼「本気」で戦うなら ／
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
今なら超時短ツール「タグ管理プラグイン（4,980円）」の無料配布キャンペーン中！
-
【超時短】ブログの「タグ管理」機能とは？仕組み＆使い方から、メリット＆デメリットまで【WordPress】
続きを見る
今回の記事はこちらの章に属しています
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^
プラグインの種類によっては、導入済みのテーマや他のプラグインとの干渉などでWordPressに不具合が発生する可能性があります。 プラグインのご利用にあたっては、あらかじめのバックアップをおすすめします
Contents
WordPressにおける、Webフォント「Googleフォント」の削除方法【2ステップ】
【準備】テーマ側のフォント設定を変更（「WING AFFINGER5」を例に解説）
まずは事前準備として、「テーマ側」のフォント設定を変更しましょう
というのも、使用してるテーマによってはデフォルト（初期状態）でGoogleフォントが採用されてる可能性があるからですね
つまりこのあとのステップで「Googleフォントの削除」を行う前に、まずは…
- 「フォント設定」を別のフォントに切り替えておく必要がある
ということ
で、この「テーマ側のフォント設定」の手順というのは、当然使ってるテーマによって変わってきます
今回は例として、当ブログでも愛用中のテーマ「WING（AFFINGER5）」におけるフォント設定の変更手順を見ていきます
↑ WordPress管理画面 ＞ AFFINGER5 管理 をクリックします
↑ 左側のメニュー一覧から、「デザイン」タブをクリックします
「デザイン」タブが開けたら、そのなかの…
↑「フォントの種類」という場所を見てみましょう
初期状態では…
↑「記事タイトル・見出し（h2～3）・ウィジェットボタンなど」の項目に…
- Noto Sans
というGoogleフォントが設定されてます（カッコ内の数字は、フォントの「太さ」を表してます）
このフォントを、別のフォントに切り替えましょう
選択肢にある各フォントの概要は、次の通り
- 「使用しない」 ⇒ AFFINGER5全体で標準フォントになってる「メイリオ」に変わる
- 「M PLUS Rounded 1c」 ⇒ Googleフォントの1種なので、今回のようにGoogleフォントを削除する場合は選ばない
- 「游ゴシック」 ⇒ Webフォントではない通常のフォント（Internet Explorer11だとズレが生じるのでおすすめしない）
- 「游明朝」 ⇒ 同じく、Webフォントではない通常フォント（こちらも、Internet Explorer11だとズレが生じる）
つまり結論、特にこだわりがなければ「使用しない」の一択かなと思います
これで、標準フォントである…
- メイリオ
になります
ということで、設定ができたら画面下部の「save」を忘れずにクリックして保存しましょう
つづいて、肝心の「Googleフォントの削除方法」について見ていきます🐥
【本題】プラグイン「Autoptimize」で、「Googleフォントの削除」を選択
GoogleフォントをWordPressブログから削除する方法として手っ取り早いのは、「プラグイン」を使うことです
ズバリ…
- Autoptimize
という、コード最適化のためのプラグインを使います
今回の「Googleフォント削除」という目的を除いても、表示スピード改善のためには必須とも言えるくらい便利なツール
そんな「Autoptimize」で「Googleフォント削除」の設定をする手順は、次の通りです
↑ WordPress管理画面 ＞ 設定 ＞ Autoptimize をクリックします
「Autoptimize」の設定画面が表示されたら、画面上部の…
↑「追加」タブをクリックします
「追加」タブが開けたら…
↑「追加の自動最適化」という項目にある、「Googleフォント」という欄を見ましょう
ここの選択肢で…
↑「Googleフォントの削除」という項目を選べばOK
選択できたら、画面下部の「変更を保存」を忘れずにクリックして完了です♪
一通りおわったら、実際の画面上で正常に反映されているかどうかチェックしておきましょう
注意
WordPressにおける各種設定は、反映までに時間がかかる場合があります。 すぐに反映させたいときは、次の「2つの方法」を試してみてください
① WordPressキャッシュのクリア
② パーマリンク設定の更新
具体的な手順はこちら ↓
-
WordPressで、設定内容が反映されないときにまず試したい2つの対処方法【キャッシュの削除／パーマリンク設定の再保存】
続きを見る
ちなみに、「Autoptimize」の全般的な設定についてはこちら ↓
-
WordPressプラグイン「Autoptimize」の基本的な設定方法【ブログのページ表示速度を高速化】
続きを見る
おしまい♪
あずき🐥
＼「本気」で戦うなら ／
―― 検証と改善を重ねた唯一無二のテーマ ――
WING AFFINGER5
✔ 洗練された美しいデザインと、「変幻自在」な圧巻のバリエーション！
✔ 時間のかかる面倒なカスタマイズも、「クリック1つ」でさくさく実現！
✔ 「本気で戦う」ための、最適化されたSEO対策と収益UPの機能が標準装備！
今なら超時短ツール「タグ管理プラグイン（4,980円）」の無料配布キャンペーン中！
-
【超時短】ブログの「タグ管理」機能とは？仕組み＆使い方から、メリット＆デメリットまで【WordPress】
続きを見る
今回の記事はこちらの章に属しています
About me
- 専業ブロガー・フリーランス -
あずき
独立3年目 / 元アパレル → 歴10年
20代は中華鍋のように目まぐるしい日々でした。 30代は創作懐石のように、静かに自分の形をつくっていきます
普段はTwitterにわりといるので、覗いてもらえると嬉しいです^^