WordPressで、style.cssを編集してもサイトに反映されないときはこれで解決
このサイトは、テーマ「Hueman」を使っているので、style.cssをいじることはないのですが、他に運用しているサイトでは、いちからスタイルを作ったりしているので、そのサイトで、レイアウトを変えたいときは、style.cssをゴリゴリいじる必要があります。
※無料テーマ「Hueman」」のデザインカスタマイズ設定の詳細はこちらの記事を参照ください！ 「WordPress 無料テーマ「Hueman」のCSSをカスタマイズするやり方」
で、そのcssを変えて、サイトを表示してもstyleがいつまで経っても反映しないで、ちょー困った経験があります。
問題の根源は、「Cache（キャッシュ）」ってやつですね。
ブラウザがcssのキャッシュを保持していて、古いcssファイルを読みに行ってしまうので、サーバー上では最新のファイルが上がっていても、いつまでたっても、ブラウザくんが古いお友達を呼び寄せてしまうのです。
そんな時は、「header.php」に、下記のようなおまじないをかけてあげれば解決します。
修正前
<link rel="stylesheet" href="<?php bloginfo ('stylesheet_url'); ?>" type="text/css" />
修正後
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" />
これが、「style.css」の最新のファイルを読みに行ってね！ というおまじないです。
「?」以降のfilemtimeで、ページアクセス時点のタイムスタンプ(unixtime)を付与しています。
このタイムスタンプパラメータが付いている場合、そのタイムスタンプに合致するファイルを探しに行っているわけですが、通常、style.cssの更新と同じタイミングでサイトを更新をするわけではなく、style.cssの更新後にサイトを更新しているので、一致しないわけです。
そうした「一致しない」状況になった時、ブラウザはキャッシュされている古いcssファイルを破棄して、新しいcssファイルを読みに行くという原理です。
style.cssを更新しても、なかなかサイトに反映しない状況にハマってしまったら、上記のおまじないをかけてあげてください！
