• HOME
  • WordPress
  • [jQuery ui 1.92版]管理画面にCSSとJSを読み込ませる 追記

[jQuery ui 1.92版]管理画面にCSSとJSを読み込ませる 追記

jQuery ui1.92版

//cssの読み込み
function events_styles() {
global $post_type;
if( 'works' == $post_type ) {
wp_enqueue_style('ui-smoothness', get_bloginfo('template_url') . '/css/smoothness/jquery-ui-1.9.2.custom.css');
}
}
add_action( 'admin_print_styles-post.php', 'events_styles', 1000 );
add_action( 'admin_print_styles-post-new.php', 'events_styles', 1000 );
//jsの読み込み
function events_scripts() {
global $post_type;
if( 'works' == $post_type ) {
wp_enqueue_script('jquery183', get_bloginfo('template_url') . '/js/jquery-1.8.3.js');
wp_enqueue_script('jquery-ui', get_bloginfo('template_url') . '/js/jquery-ui-1.9.2.custom.js');
wp_enqueue_script('myjs', get_bloginfo('template_url') . '/js/myjs.js');
}
}
add_action( 'admin_print_scripts-post.php', 'events_scripts', 1000 );
add_action( 'admin_print_scripts-post-new.php', 'events_scripts', 1000 );

admin_print_scripts-post-new.phpとかを変更すれば読み込むページを変更することができる。
特定のカスタム投稿とかの場合は投稿タイプを取得して条件をいれたり
カスタムタクソノミーを取得して判断したりとか。

管理画面にjQueryを読み込むと通常の状態だとオリジナルのJSとコンクリフトを起こしてしまうのでそのあたりを考慮して最初からJSを設定する必要があるみたい。

改訂版

function events_styles() {
wp_enqueue_style('ui-smoothness', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/smoothness/jquery-ui.css');
}

function admin_js() {
global $post_type;
if( 'shien' == $post_type ) {
 wp_enqueue_script('ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js', null, true);
 wp_enqueue_script('color_ui', get_bloginfo('template_url').'/js/modcoder_excolor/jquery.modcoder.excolor.js', null, true);
 wp_enqueue_script('admin', get_bloginfo('template_url').'/js/myjs.js', null, true);
}
}

add_action( 'admin_print_styles-edit-tags.php', 'events_styles', 1000 );
add_action( 'admin_print_scripts-edit-tags.php', 'admin_js', 1000 );

wp_enqueue_scriptの仕様変更があり。

第4引数や第5引数がある。
5については true / false trueの場合には閉じ/headの近くに出力される。
admin_print_styles-edit-tags.phpの部分は「-php」でやるのではなく「.php
管理画面にJsを読み込む場合はコンクリフトのことを考える。
実行箇所のところを

jQuery(function($){
$('.edit-tags-php #tag-description,.edit-tags-php #parent').closest("div.form-field").hide();
$('.form-table input').modcoder_excolor({});
});

とし
jQuery(function($)をつかっておく。
jquery本体のほうはwordpressのjqueryを使うならコンクリフト対策がされてあるのでそれを利用する。

global $taxonomy;
if( ‘shien-cat’ == $taxonomy ) {

}
これもいける良いね!