web-dev-qa-db-fra.com

Charger les scripts et les styles de plug-in uniquement sur la page du plug-in

Bonjour les utilisateurs de wordpress,

Je suis coincé avec un problème lors de l'exécution de 2 plugins Wordpress fabriqués par nos soins. Je vais utiliser le code suivant:

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' );
    }
}

Mais c'est charger cette feuille de style partout dans le panneau d'administration. Maintenant, j'ai trouvé ceci dans le codex:

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' );

Mais ce code ne fonctionne pas pour mon .. Quelqu'un at-il une autre option? Ou peut-être savoir pourquoi ça ne marche pas pour moi?

adminscriptsstyles
4
Ronny Rook

Lorsque vous enregistrez une page d’option de plug-in, vous obtenez un accrochage de la fonction d’enregistrement:

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

Utilisez ce crochet pour mettre en file d'attente les scripts et les styles:

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

Voir mon plugin T5 Admin Menu Demo pour un exemple.

Ne définissez pas une constante PLUGIN_URL. Vous rencontrerez des collisions avec d'autres codes.

7
fuxia

Après des recherches approfondies, @fuxia a la meilleure réponse, même lorsque vous utilisez Redux Framework pour un menu administrateur. Lorsque vous utilisez Redux, $hook sera toplevel_page_ concaténé avec la valeur que vous avez entrée dans page_slug dans le fichier options-init.php.

Par exemple:

$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" );

De plus, si vous ne vous souvenez pas de ce que vous avez défini pour my_option, ouvrez simplement votre panneau d’administration Redux et consultez l’URL:

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

0
Chris Sprague