この記事は最後に更新してから1年以上経過しています。

スクリプトファイルのバージョンパラメータを変更する

WordPressのバージョン番号で大丈夫？

説明

Java Scriptやスタイルシートの指定を直接head要素内に記述せず、wp_enqueue_scriptsフィルターなどを使って指定する場合、WordPressのバージョン番号が付与されている。このバージョン番号は、妥当なんだろうか。

テーマにおいてJava Scriptやスタイルシートを指定する場合、テーマ内のfunctions.phpなどに次のような内容を記述する。

function my_enqueue_scripts() {
	wp_enqueue_style( 'mytheme-style', '/css/common.css' );
	wp_enqueue_script( 'mytheme-script', '/js/common.js' );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );

実際に出力されるHTMLは次の通り。

<link rel='stylesheet' id='toshokan-style-css' href='http://localhost/css/common.css?ver=4.1' type='text/css' media='all' />
<script type='text/javascript' src='http://localhost/js/common.js?ver=4.1'></script>

href属性値は wp_enqueue_style関数のパラメータで指定したURLの後にverパラメータが追加されていることがわかる。これはwp_enqueue_style関数（および wp_enqueue_script関数）の第4パラメータを省略した場合の動作であり、第4パラメータには任意の文字列を指定できる。

標準のverパラメータの内容が妥当なのかと思った理由は、これがWordPressのバージョンであることだ。仮にWordPress本体のアップデートが遅れた場合、そのことを外部に知らせてしまうことになる。name属性がgeneratorのmeta要素を出力していないのであれば、標準のまま使用することは避けたほうがいい。

ファイルの更新日時に変更する

WordPressのバージョン番号の代わりとしてまず思いついたのが、そのファイルの更新日時。ブラウザのキャッシュ対策としてもこれなら有効だろう。ソースコードは次のような感じになる。

function my_enqueue_scripts() {
	wp_enqueue_style( 'mytheme-style', '/css/common.css', array(), script_datetime( '/css/common.css' ) );
	wp_enqueue_script( 'mytheme-script', '/js/common.js', array(), script_datetime( '/js/common.js' ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );

function script_datetime( $path ) {
	return date( "Ymd-His", @filemtime( ABSPATH.ltrim( $path, '/' ) )+3600*9 );
}

script_datetime関数では、スクリプトのフルパス名からそのファイルの更新日時を取得し、年月日時分秒の文字列を生成している。なおWordPress内部のタイムゾーンがUTCになっているため、日本（JST）の時差分の秒数を取得したファイルの秒数に加算している。

この変更により、common.cssの出力内容は次のように変わる。

<link rel='stylesheet' id='toshokan-style-css' href='http://localhost/css/common.css?ver=20150210_154321' type='text/css' media='all' />

ファイルのバージョン番号に変更する

ファイルの更新日時を公開したくない場合には、Java Scriptやスタイルシートの冒頭部分にバージョン番号のコメントを入れ、そのバージョン番号を利用することもできる。ファイルに追加する最低限の内容は次の通り。

/*
Version: 1.0.0
*/

このコメントとして追加したバージョン情報は get_file_data関数で取得できる。この対応を行ったソースコードは次のような感じになる（バージョン情報を取得できない場合は'0.0.0'を出力）。

function my_enqueue_scripts() {
	wp_enqueue_style( 'mytheme-style', '/css/common.css', array(), 'c'.file_version( '/css/common.css' ) );
	wp_enqueue_script( 'mytheme-script', '/js/common.js', array(), 'j'.file_version( '/js/common.js' ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );

function file_version( $path ) {
	$headers = get_file_data( ABSPATH.ltrim( $path, '/' ), array( 'Version' => 'Version' ) );
	return empty( $headers['Version'] )? '0.0.0': $headers['Version'];
}

この変更により、common.jsの出力内容は次のように変わる。

<script type='text/javascript' src='http://localhost/js/common.js?ver=j1.0.0'></script>

なおファイルのパージョン番号の場合、WordPressのバージョン番号と勘違いされてしまうため、この例では、とりあえず'c'や'j'を付与している。

最後に、掲載したソースコードはWordPressがサイトのドキュメントルートディレクトリに配置している場合の記述になるため、別のディレクトリに配置している場合は ABSPATH当たりを適宜工夫してほしい（ファイルが存在しない場合のエラー処理も忘れずに）。

最終更新 : 2018年05月27日 10:46

関連

お勧め

wp_authenticate（2022年1月31日 更新）

WP_User | WP_Error wp_authenticate( string $username, string $password )
ユーザー認証を行う。

wp_send_json_success（2020年12月10日 更新）

void wp_send_json_success( [ mixed $response = null [ , int $status_code = null [ , int $options = 0 ] ] ] )
AJAXリクエストの成功レスポンスとしてJSON情報を返す。

wp_oembed_get（2014年11月16日 更新）

mixed wp_oembed_get( string $url [ , mixed $args = '' ] )
oEmbedに対応したページの埋め込み用コンテンツを取得する。

setup_postdata（2014年11月16日 更新）

bool setup_postdata( stdClass $post )
投稿記事に関連するグローバル変数を設定する。

the_permalink（2018年5月27日 更新）

void the_permalink( [ mixed $post = 0 ] )
現在の投稿データのパーマリンクを表示する。