web-dev-qa-db-ja.com

プラグインページにのみプラグインスクリプトとスタイルをロードする

ワードプレスの皆さん、こんにちは。

2自作のWordpressプラグインを実行している間、私は問題で立ち往生しています。次のコードを使います。

define('PLUGIN_URL', plugin_dir_url( __FILE__ ));
add_action( 'admin_enqueue_scripts', 'plugin_load_js_and_css' );

function plugin_load_js_and_css() {
        wp_register_style( 'plugin.css', PLUGIN_URL . 'plugin.css', array());
        wp_enqueue_style( 'plugin.css');

        wp_register_script( 'plugin.js', PLUGIN_URL . 'plugin.js', array('jquery'));
        wp_enqueue_script( 'plugin.js' );
    }
}

しかし、このスタイルシートを管理パネルのいたるところにロードしています。今、私はコーデックスでこれを見つけました:

function my_enqueue($hook) {
    if( 'edit.php' != $hook )
        return;
    wp_enqueue_script( 'my_custom_script', plugins_url('/myscript.js', __FILE__) );
}
add_action( 'admin_enqueue_scripts', 'my_enqueue' );

しかし、このコードは私のために働いていません..誰かが別の選択肢がありますか?それとも私にはうまくいかないのか、多分知っている?

4
Ronny Rook

プラグインオプションページを登録するとき、あなたは登録機能からフックを得ます:

$hook = add_menu_page(
    'T5 Demo',        // page title
    'T5 Demo',        // menu title
    'manage_options', // capability
    't5-demo',        // menu slug
    'my_render_page'  // callback function
);

このフックを使用して、スクリプトとスタイルをエンキューします。

add_action( "admin_print_styles-$hook", "my_enqueue_style" );
add_action( "admin_print_scripts-$hook", "my_enqueue_script" );

例として私のプラグイン T5 Admin Menu Demo を見てください。

定数PLUGIN_URLを定義しないでください。あなたは他のコードと衝突するでしょう。

7
fuxia

さらに調査した結果、管理メニューにRedux Frameworkを使用している場合でも、@fuxiaが最良の回答を得ました。 Reduxを使用する場合、$hookは、toplevel_page_ファイルのpage_slugに入力した値と連結されたoptions-init.phpになります。

例えば:

$opt_name = my_option

'page_slug' => $opt_name.'_settings'

add_action( "admin_print_styles-**toplevel_page_my_option_settings**", "my_enqueue_style" );
add_action( "admin_print_scripts-**toplevel_page_my_option_settings**", "my_enqueue_script" );

また、my_optionの設定を覚えていない場合は、Redux管理パネルを開いてURLを確認するだけです。

yoursite/wp-admin/admin.php?page=**my_option_settings**&tab=1

0
Chris Sprague