WP Social Bookmarking Light の管理ページをつくってるときにハマった点メモ。
メモ
JavaScript と CSS の読み込みには、wp_enqueue_script と wp_enqueue_style APIを使用する。
管理ページ上で上記 API を反映させる為に、add_action の admin_print_styles と admin_print_scripts を使用する。
ただし、単純に
add_action('admin_print_styles', 'myplugin_admin_print_styles'); add_action('admin_print_scripts', 'myplugin_admin_print_scripts'); |
とすると、他のプラグインの管理ページにも同様に指定の JavaScript と CSS が反映されてしまい、競合等の迷惑をかける可能性がある。
この問題は、例えばこのように
$page = add_options_page('myplugin', 'myplugin', 'manage_options', __FILE__, 'myplugin_admin_page'); add_action('admin_print_styles-'.$page, 'myplugin_admin_print_styles'); add_action('admin_print_scripts-'.$page, 'myplugin_admin_print_scripts'); |
add_options_page 等の戻り値を admin_print_styles や admin_print_scripts のお尻に加えてあげると回避できる。
全体像
WP Social Bookmarking Light からソースコード抜粋。
function wp_social_bookmarking_light_admin_print_scripts() { wp_enqueue_script('jquery'); wp_enqueue_script('jquery-ui-core'); wp_enqueue_script('jquery-ui-tabs'); } function wp_social_bookmarking_light_admin_print_styles() { wp_enqueue_style('jquery-ui-tabs', WP_SOCIAL_BOOKMARKING_LIGHT_URL."/libs/jquery/css/pepper-grinder/jquery-ui-1.8.6.custom.css"); } if( function_exists('add_options_page') ){ $page = add_options_page( 'WP Social Bookmarking Light', 'WP Social Bookmarking Light', 'manage_options', __FILE__, 'wp_social_bookmarking_light_options_page' ); add_action('admin_print_styles-'.$page, 'wp_social_bookmarking_light_admin_print_styles'); add_action('admin_print_scripts-'.$page, 'wp_social_bookmarking_light_admin_print_scripts'); } |
