常に最新のCSSを読み込ませる方法

WordPressを使用していると、スタイルシートを更新してファイルをアップロードしても更新内容がサイトに反映されないという現象が起こる場合があります。これは、ブラウザには一度読み込んだファイルを保存しておいて、次回以降にサイトを閲覧した際に読み込み速度を速くするキャッシュ機能があることで起こる現象なんですね。そこで、このキャッシュ機能を利用せずに、ファイルを更新したら常に最新のCSSを読み込ませる方法を紹介します。

引数を利用して最新データを取得する

常に新しい状態を読み込ませる方法として、スタイルシートのURLの末尾に引数を付与させます。ここで付与させる引数は更新日時にします。これにより、ファイルが更新される度に末尾の値が変更されるので、前回とは別のファイルであると認識されます。

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>?ver=<?php echo date('U'); ?>">

「<?php echo date(‘U’); ?>」を使ってUnix時間で出力して付与させています。実際に出力されるURLは次のようになります。

<link rel="stylesheet" href="http://■■■.com/…/mytheme/style.css?ver=1490071374">

以上が、常に最新のCSSを読み込ませる方法となります。キャッシュを利用したくないという方は試しに使ってみてください。