Lightningを使用してサイトを作成する際に子テーマの読み込みがキャッシュされて面倒だったので、クエリを付与してみました。
子テーマのstyle.cssの更新日時をクエリとして付与しています。
functions.phpに記述（子テーマ側）
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'lightning-theme-style', get_stylesheet_directory_uri().'/style.css', array('lightning-design-style'),date("ymdGis", filemtime( get_stylesheet_directory() . '/style.css')) );
}なぜこのように記述するのか、簡単にメモしておきます。
まず、Lightningの親テーマでのCSSの読み込みを見てみましょう。
functions.php（親）の129行目
/*-------------------------------------------*/
/* Load CSS
/*-------------------------------------------*/
add_action( 'wp_enqueue_scripts', 'lightning_css' );
function lightning_css() {
wp_enqueue_style( 'lightning-theme-style', get_stylesheet_uri(), array( 'lightning-design-style' ), LIGHTNING_THEME_VERSION );
}lightning-theme-styleというハンドル名で現在有効中のテーマのstyle.cssを読み込んでいます。
つまり、子テーマを使用している場合は子テーマ側のstyle.cssがlightning-design-styleみ込まれています。
親テーマ側のstyle.cssは読み込まれていないので注意しましょう。
その代わり、デザインスキンのCSSがlightning-design-styleというハンドル名で読み込まれています。
以上を踏まえ、
lightning-theme-styleというハンドル名で新たに子テーマのstyle.cssを読み込む- クエリを付与
- 依存ファイルに
lightning-design-styleを指定する
としたものが冒頭のコードになります。
wp_enqueue_styleの基本的なことは以下を参考にしてみてください。
あわせて読みたい
WordPressでファイルを読み込むためのwp_enqueue_styleとwp_enqueue_scriptの使い方と引数の意味を理解...
webサイトでcssやjsファイルを読み込む時、普通ならheadタグ内にlinkタグなどを記述しますが、WordPressではwp_enqueue_style()やwp_enqueue_script()といった関数を使...
また、クエリの付け方については以下で詳しく説明しています。
あわせて読みたい
WordPressで読み込むCSSやJSファイルにクエリパラメータを付与し、ブラウザキャッシュは有効のまま変更...
CSSなどを変更してクライアントに確認してもらう時、「変わってませんよ？」と言われ、「すみません、キャッシュです。お手数ですが削除してから…」という不毛なやり取...
コメント