WordPressでフォントが変わらない原因と解決方法 【初心者OK】

WordPressでフォントを変更したのに反映されないと困りますよね。
CSSを書いたのに変わらない場合、「なぜ反映されないのか分からない」と悩む方も多いと思います。

実は、フォントが変わらない原因はいくつかパターンがあります。

この記事では、よくある原因と具体的な解決方法を初心者の方にも分かりやすく解説します。

結論

WordPressでフォントが変わらない主な原因は以下の通りです。

・キャッシュが残っている
・セレクタが間違っている
・優先順位（specificity）の問題
・フォントが正しく読み込まれていない
・日本語フォントが指定されていない

上から順番に確認していけば、ほとんどの場合は解決できます。

【原因1：キャッシュが残っている】

フォントが変わらない原因で最も多いのがキャッシュです。
ブラウザやWordPress側のキャッシュによって、古いCSSが表示されていることがあります。

★ 解決方法

・ブラウザでCtrl + F5を押してスーパーリロードする
・キャッシュ系プラグインを使用している場合はキャッシュを削除する
・サーバーキャッシュがある場合はクリアする

【原因2：セレクタが間違っている】

CSSで指定しているセレクタが間違っていると、フォントは適用されません。

★ 解決方法

・ブラウザの検証ツールで対象要素を確認する
・正しいクラス名やタグに指定する

例：

body {
font-family: 'Noto Sans JP', sans-serif;
}

【原因3：優先順位（specificity）の問題】

他のCSSの方が強い指定になっている場合、フォントが上書きされてしまいます。

★ 解決方法

・より具体的なセレクタに変更する

例：

/* 弱い */
p {
font-family: serif;
}

/* 強い */
body p {
font-family: 'Noto Sans JP', sans-serif;
}

【原因4：フォントが正しく読み込まれていない】

Googleフォントなどを使用している場合、読み込みコードがないと適用されません。

★ 解決方法

・head内にフォント読み込みコードを追加する

例：

<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap" rel="stylesheet">

・CSSでフォントを指定する

body {
font-family: 'Noto Sans JP', sans-serif;
}

【原因5：日本語フォントが指定されていない】

英語フォントのみ指定している場合、日本語部分には適用されません。

★ 解決方法

・日本語フォントを一緒に指定する

例：

body {
font-family: 'Roboto', 'Noto Sans JP', sans-serif;
}

【よくあるミス】

以下のような単純なミスでもフォントは反映されません。

・フォント名のスペルミス
・シングルクォーテーションやダブルクォーテーションの抜け
・全角スペースが混ざっている

細かい部分も確認することが大切です。

【それでも変わらない場合】

上記で解決しない場合は、以下の可能性もあります。

・プラグインが干渉している
・テーマ独自のCSSが影響している
・CDNのキャッシュが残っている

一度プラグインを停止したり、別テーマで確認すると原因を特定しやすくなります。

まとめ

WordPressでフォントが変わらない場合は、基本的な原因がほとんどです。

・まずはキャッシュを確認する
・次にセレクタと優先順位をチェックする
・フォントの読み込みと指定を見直す

順番に確認していけば解決できますので、落ち着いて一つずつ試してみてください。