ワードプレスの下書きプレビューで修正したCSSが反映されない時の対処方法

公開日:  最終更新日:2018/01/27

ワードプレスでスタイルシート(CSS)を修正した後に記事を「下書きプレビュー」で確認しても修正したはずのスタイルシートが適用されていないという現象で悩んでしまいました。

解決方法が分かったのでメモとして残しておきます。

納品直前に重大なバグを発見して泣き崩れる赤ちゃん

原因はキャッシュ

私の使っているパソコンのOSはWindowsでブラウザはChromです。

下書きプレビューのページで右クリックして「ページのソースを表示」から適用されているスタイルシートを確認してみると、修正前のスタイルシートの内容になっていました。

つまり修正された内容が反映されていないということです。

Chromなら「Ctrl + F5」を押してみよう

Chromなどのブラウザソフトはページ表示速度を少しでも早くしようと「キャッシュ」という技術を使っています。簡単に説明すると1回見たページの内容を記憶して、次同じページを表示する時は記憶して置いたページを表示するという技術です。

そのため、下書きプレビューで確認したページはキャッシュにより記憶していたスタイルシートを使って表示した内容だったのです。

修正したスタイルシートでページを表示したい時は、Chromなら「Ctrl」キーと「F5」キーを同時に押す、「Ctrl + F5」でキャッシュをクリアして読込み直すことが可能です。



ご愛読ありがとうございます!

よければシェアとツイッターのフォローもよろしくお願い致します!

  • このエントリーをはてなブックマークに追加
  • Pocket
  • このエントリーをはてなブックマークに追加