【WordPress】CSSファイルの更新日時を取得して自動的にパラメータを付与する方法

CSSやJSファイルを更新する際に、ブラウザがキャッシュを無視して新しいバージョンを取得するために、通常はクエリパラメータを使用します。クエリパラメータを変更することで、ブラウザはファイルを新しいものと見なし、キャッシュされた古いバージョンを無視します。

しかし、更新を行う度に毎回パラメータを付与しなおすのは以外と手間が掛かります。特に更新頻度が高い場合は、自動化できると非常に作業が楽になります。

CSSファイルに自動的にタイムスタンプを付与する方法

<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/style.css?<?php echo filemtime(get_theme_file_path('/css/style.css')); ?>" >

このコードでは、filemtime() 関数を使用して、style.css ファイルの最終更新日時を取得し、それを ? の後に追加しています。これにより、ブラウザはCSSファイルをキャッシュせず、必要に応じて新しいバージョンをダウンロードします。

この方法は、WordPressのテーマファイル内のCSSファイルにのみ適用されます。同様に、JavaScriptファイルにも適用できます。

<script src="<?php echo get_template_directory_uri(); ?>/js/script.js?<?php echo filemtime(get_theme_file_path('/js/script.js')); ?>"></script>

これにより、CSSやJSファイルが更新された際に、ブラウザが新しいバージョンを取得するようになります。