work.log

元エンジニアの備忘録的ブログ

WordPressのstyle.cssに任意のバージョンを設定する

投稿:2014-03-17 16:51  更新:

WordPress の style.css に任意のバージョンを設定する方法のメモです。

WordPress のテーマが使う style.css のバージョンは、意図的に消したりしなければ HTML ソース中に「style.css?ver=3.8.1」みたいに、WordPress のコアバージョンが勝手に設定されますが今回はこれを任意のバージョン番号にしてみたいと思います。

バージョン番号を任意に変更したい意図としては、Expires ヘッダを設定してブラウザキャッシュを使うようにしていると、変更がクライアントに上手く反映できなくなるのでその対策にという感じです。

style.css のバージョンをフックで任意に設定

拾い物なんですがとりあえずコードから。

function my_wp_default_styles( $styles ) {
	$styles->default_version = 20140217;
}
add_action( 'wp_default_styles', 'my_wp_default_styles' );

wp_default_styles のフックを使ってバージョンを設定する感じです。

注意点としては wp_register_style でバージョンのオプションを省いて設定していると、上記の値でバージョンが上書きされます。

大きく害がある訳じゃないのですが、style.css の更新に付随して上記のバージョンも上がります。そのため、ブラウザキャッシュが無効になりちょっとだけ無駄なトラッフィクが流れることになります。

バージョンの変更方法はこんな感じです。

style.css のバージョンを自動で設定

上記のように設定すればブラウザキャッシュももう怖くないという感じなのですが、更新の度に functions.php を弄るのは面倒ですね。バージョンの上げ忘れとかやらかしそうですし。

という事で、下記のようにコードをプチカスタマイズしてみました。

function my_update_styles( $styles ) {
	$mtime = filemtime( get_stylesheet_directory() . '/style.css' );
	$styles->default_version = $mtime;
}
add_action( 'wp_default_styles', 'my_update_styles' );

PHP の filemtime 関数で style.css の最終更新日時を取得してそれをバージョンとして使っちゃうという感じです。バージョン番号には UNIX time 形式の数字が設定されます。

こうすればバージョンの上げ忘れもないし何ら気にすることなく今まで通り style.css の編集ができます。

バージョンの自動設定はこんな具合です。

簡単ですが style.css に任意のバージョンを設定する方法はお終いです。

おすすめのVPSサーバ

  • OSが選べる
  • VPS同士でLANが組める
  • 複数台構成向き

このブログで使っています。

  • 転送量が多いサービスに
  • 借りてるのは3年間一度もdown無し!

よく見られている記事

  • 本日
  • 週間
  • 月間