wp_register_style() の使い方|説明・引数・注意点

説明

wp_register_style() は、CSSを登録だけして、読み込みは後で行う関数です。

基本構文

wp_register_style( string $handle, string|false $src, string[] $deps = array(), string|bool|null $ver = false, string $media = 'all' ): bool

引数

  • $handle:識別名
  • $src:CSSのURL
  • $deps:依存するスタイル
  • $ver:バージョン
  • $media:メディア指定

戻り値

登録できたら true。

使い方(サンプル)

wp_register_style( 'my-lib', get_theme_file_uri( 'css/lib.css' ) );
// 必要な場所で
wp_enqueue_style( 'my-lib' );

注意点

  • 登録しただけでは出力されません。wp_enqueue_style() を呼ぶ必要があります。
  • 条件付きで読み込むスタイルを事前に登録しておくときに便利です。

実務での使いどころ

  • CSSを登録だけして、必要なときに、ハンドル名で読み込むとき。
  • 複数の場所から、同じCSSを使い回すとき。

よくあるミスと対処

  • 登録しただけで、読み込んでいない。登録は、読み込みの予約ではない。読み込むには、wp_enqueue_style() を呼ぶ。
  • 同じハンドル名で、すでに登録されている。後から登録しても、無視される。
  • wp_enqueue_scripts フックを使わずに、直接呼び出している。

NG例

add_action( 'wp_enqueue_scripts', function () {
	wp_register_style( 'my-style', get_theme_file_uri( '/css/main.css' ) );
	// 登録だけで、読み込まれない
} );

OK例

add_action( 'wp_enqueue_scripts', function () {
	wp_register_style( 'my-style', get_theme_file_uri( '/css/main.css' ), array(), '1.0.0' );
	if ( is_front_page() ) {
		wp_enqueue_style( 'my-style' );
	}
} );

使い分け早見表

関数 役割
wp_register_style() 登録するだけ
wp_enqueue_style() 読み込みを予約する
wp_deregister_style() 登録を解除する

関連項目

wp_enqueue_style()、wp_deregister_style()

公式リファレンス:wp_register_style() | Function | WordPress Developer Resources

コメント

タイトルとURLをコピーしました