WordPressでadmin_print_stylesを使わずにプラグインの管理画面メニューのみCSSを読み込ませる方法とは

こんにちは、WPホームページ研究所の運営サポートチーム（@WP_LABO）です。

ワードプレスの管理画面に追加した特定メニューだけCSSでデザイン変更する方法をご紹介いたします。本記事は業務の覚え書きとして残しておきます。方法は掲載手順以外にも色々あるのでお試しください。

WordPressでadmin_print_stylesを使わずにプラグインの管理画面メニューのみCSSを読み込ませる方法とは

カンタンに言えば「現在開いている管理画面の状態を取得して条件分岐でCSSを読み込めばOK」です。まずは管理画面を開いた状態でアドレスバーに表示されているURLを確認しておきましょう。

http://example.com/wp-admin/edit.php?post_type=custom_post_name&page=plugin-admin-settings

次が条件分岐です。もし「custom_post_name_page_plugin-admin-settings」なら「plugin-admin-style.css」を読み込むという命令文となります。環境に合わせて変更してご使用するのがおすすめです。

function plugin_only_menu_load_admin_css( $hook ) {
	if($hook != 'custom_post_name_page_plugin-admin-settings') {
		return;
	}
	wp_enqueue_style( 'custom-wp-admin', plugins_url('plugin-admin-style.css', __FILE__) );
}
add_action( 'admin_enqueue_scripts', 'plugin_only_menu_load_admin_css', 10, 1 );

カスタマイズ時はぜひお試しください。