WordPressのテーマのstyle.cssは、header.php内で以下のようなphpで出力されている。
↓ php
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); ?>">↓ 出力されるhtmlコード（※例はサイトurlがsample.comで、テーマ名がsample_themeだったとき）
<link rel="stylesheet" type="text/css" href="http://sample.com/wp-content/themes/sample_theme/style.css">このstyle.cssを変更した場合、普通は.cssのあとに更新日付をパラメータ名にして付与し、style.css?20230728のようにすることで、
ブラウザのキャッシュに残っっているstyle.cssとは別のファイルと認識することで、擬似的にキャッシュをクリアできる。
ただし、先ほどの一つ目のテンプレートタグのように
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); ?>?20230728">のように記述してもこれがだめ！
テンプレートタグの挙動なのか、末尾につけた
?20230728がきれいにパージされて、それがない形のstyle.cssのみが出力されてしまう。
結果、擬似的にキャッシュがクリアされないで、古いスタイルで表示される。
なので、あくまでphpで出力するときはphpで解決できる。以下のように書き換える。
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>">こうすることで、フロントでも
style.css?20230728が出力される。(結果、ブラウザのキャッシュクリアをせずとも、ブラウザが別のcssとして更新して表示してくれる。
※余談ですが、そもそも本記事で取り上げたテーマディレクトリ直下のstyle.cssファイルは、カスタマイズして変更しない方が本当は管理上よいです。
なぜかというと、Wordpressの”テーマのアップデート”を行った際に、この、テーマ直下のstyle.cssというファイルが新バージョンに自動更新されてしまい、自分の行ったカスタマイズ内容が全て消えるからです。
以上です！
