【WordPress】CSSの変更をした時に「反映されない・・」を解決｜試して欲しい方法

本日はこんなお悩みを解決していきます。

最近、別サイトのCSSを変更したらなぜかCSSが反映されなくてかなり苦戦しました。

私はいつもデザインの変更をして反映されない時は、以下のことを見直すようにしています。

などをチェックします。

自分で記述したコード、どこからかコピペしてきたコード関わらず一度見直します。

前に変更が反映されなかった時には、リロード（更新）すれば変更が反映されていたのですが、今回はそれでも反映されませんでした。

今回は、検証（デベロッパーツール）を確認したところ変更後のコード自体が読み込まれていなかったのでキャッシュが残っているのかなと思いました。

CSSが読み込まれていないかどうかは、カーソルを当てて右クリックで検証を押すとコードが出てくるので該当するコードを探して確認します。

今回は上記のことから、キャッシュについての解決策を探してみました。

また、他のWebブラウザでも確認したところ、きちんと変更されていたのでキャッシュの問題だと確信しました。

キャッシュは、履歴からクリアすることもできますが、これをするとcookieも消えてしまって他のサイトのログイン情報もログアウトしてしまうので少し面倒臭いです。

「他に良い方法はないかな・・」と探していたら良い方法があったので今回ご紹介します。

CSSを変更したのに反映されない・・という人は参考にしてください。
今回はGoogle chromeの解説になります。

CSS変更が反映されない時に試すキャッシュをクリアする方法

そんな時にキャッシュをクリアする方法があります。

しかし履歴からクリアしても他のサイトのログイン情報もクリアされてしまうので後々面倒です。

やり方はとても簡単なので一緒にやっていきましょう。

デベロッパーツールを開く

まず、リロードしたいページで右クリックをして検証を選択してデベロッパーツールを開きます。

リロードボタンを長押しする

次に、ブラウザの左上のリロード（更新）ボタンを長押しします。

すると次の3つが出てくると思います。

今回はハードの再読み込みを選択します。

これでCSSが反映されます。

ハードの再読み込みは、キャッシュ機能を無視して強制的にサーバーからページをダウンロードするという方法なんです。

キャッシュを全てクリアしなくてもこれだけで変更が反映されるはずです。

まとめ：CSSを変更しても反映されない時の対処法

いかがだったでしょうか。

今回はCSSを変更しても反映されない時の対処法についてご紹介してきました。

困った時はとても簡単なので試してみてください。

それでもうまくいかない・・という人は、キャッシュは全てクリアされてしまいますが、さっきの方法でキャッシュと消去とハードの再読み込み選択してみてください。