Как загрузить стили/скрипты только на определенных страницах /wp-admin?

Проблема с ответом @tollmanz заключается в том, что, используя хуки -print-styles и -print-scripts, вы вынуждены вручную генерировать HTML для загрузки скриптов. Это не оптимально, так как вы теряете удобные возможности управления зависимостями и версиями, которые предоставляют функции wp_enqueue_script() и wp_enqueue_style(). Кроме того, такой подход не позволяет размещать скрипты в подвале (футере) страницы, если это было бы более подходящим местом.

Итак, возвращаясь к исходному вопросу: как лучше всего обеспечить загрузку JS/CSS только на определенных страницах админки?

1. Используйте хук "load-{$my_admin_page}", чтобы выполнять действия только при загрузке конкретной страницы админки вашего плагина, и затем

2. Используйте хук "admin_enqueue_scripts" для правильного добавления вызовов wp_enqueue_script.

Может показаться, что это немного сложно, но на самом деле реализация очень проста. Вот полный пример:

    add_action( 'admin_menu', 'add_my_admin_menus' ); // Хук для добавления меню в левую панель админки

    /**
     * Создаем меню администрирования в левой панели навигации и загружаем JavaScript только на этой странице
     */
    function add_my_admin_menus(){
        $my_page = add_menu_page( 'Заголовок страницы', 'Заголовок меню', MY_ADMIN_CAPABILITY, 'menu-slug', 'show_page_content' );

        // Загружаем JS только для этой страницы
        add_action( 'load-' . $my_page, 'load_admin_js' );
    }

    // Эта функция вызывается только при загрузке страницы нашего плагина!
    function load_admin_js(){
        // К сожалению, мы не можем просто подключить скрипты здесь - это слишком рано. Поэтому регистрируем правильный хук
        add_action( 'admin_enqueue_scripts', 'enqueue_admin_js' );
    }

    function enqueue_admin_js(){
        // Разве не здорово использовать зависимости и уже зарегистрированные основные js-файлы?
        wp_enqueue_script( 'my-script', INCLUDES_URI . '/js/my_script.js', array( 'jquery-ui-core', 'jquery-ui-tabs' ) );
    }
}

Если вы используете get_current_screen(), вы можете определить, на какой странице находитесь. В статье кодекса, на которую я дал ссылку, есть пример, показывающий, как использовать get_current_screen() вместе с add_options_page(). Этот метод будет работать для любой страницы админки.

Как упомянул @mor7ifer выше, вы можете использовать встроенную функцию WordPress get_current_screen(). Если вы переберёте вывод этой функции, например:

$current_screen = get_current_screen();
foreach($current_screen as $key => $value) {
    error_log(print_r($key,1));
}

... вы заметите ключ под названием base. Я использую его для определения текущей страницы и подключения/отключения скриптов и стилей следующим образом:

add_action('admin_enqueue_scripts', 'some_hook_function')* ):

public function some_hook_function(){

    // # регистрируем и подключаем скрипты и стили ТОЛЬКО на странице редактирования записи в админке
    $current_page = get_current_screen()->base;
    if($current_page == 'post' || $current_page == 'page') {

        wp_enqueue_script('datetimepicker', plugins_url('assets/jquery-ui-timepicker-addon.min.js', __FILE__), array('jquery', 'jquery-ui-datepicker', 'jquery-ui-slider'), '1.9.1', true);

        wp_enqueue_style( 'jquery-ui-datepicker', plugins_url('assets/jquery-ui.min.css', __FILE__), array(), '1.11.2', 'all');


    } else { // # если не на странице записи, отключаем стили и скрипты

        wp_dequeue_script('datetimepicker');
        wp_dequeue_style('jquery-ui-datepicker');

    }
}

Я тоже задавался этим вопросом. Вот современная версия с использованием admin_enqueue_scripts:

add_action('admin_menu', function () {
  $settingsPage = add_options_page('Настройки', 'Ипотечный калькулятор', 'manage_options', 'mortgagecalculator', function () {
    echo "<div id='app'></div>";
  });
  /**
   * Подключаем скрипты Ember для админки только на нужных страницах.
   */
  add_action("admin_enqueue_scripts", function ($hook) use ($settingsPage){
    if($hook !== $settingsPage){
      return;
    }
    // Удаляем стандартный jQuery, так как Ember предоставляет свой.
    wp_dequeue_script('jquery');
    wp_enqueue_script('ember-vendor', plugins_url("admin/assets/vendor.js", __FILE__));
    wp_enqueue_script('ember-project', plugins_url("admin/assets/mortgage-plugin-ember-admin.js", __FILE__), ['ember-vendor']);
    wp_enqueue_script('ember-live-reload', "http://localhost:4200/ember-cli-live-reload.js");
  });
});

Для этого сначала необходимо найти название страницы админки. Добавьте admin_enqueue_scripts с wp_die($hook) и перейдите на страницу вашего конкретного плагина, чтобы увидеть название страницы.

function my_plugin_scripts($hook) {
    wp_die($hook);
}
add_action( 'admin_enqueue_scripts', 'my_plugin_scripts' );

settings_page_plugging_info

Теперь скопируйте название страницы и используйте его в условии для загрузки скриптов только на нужной странице.

function my_plugin_scripts($hook) {
    if ( 'settings_page_plugging_info' != $hook ) {
        return;
    }

    wp_enqueue_script( 'my_custom_script', plugins_url('js/file.js', __FILE__));
}
add_action( 'admin_enqueue_scripts', 'my_plugin_scripts' );

Вы можете взять @tollmanz ответ и немного расширить его, добавив возможность условного использования...

Пример:

/* Добавляем страницы админки */   
function my_admin_pages(){
    $menu = array();
    $menu['main_page'] = add_menu_page('Страница 1', 'бар', 'something', 'else', 'foo');
    $menu['sub_page'] = add_submenu_page('theme_menu', 'Подстраница 1', 'Подстраница', 'something', 'else', 'foo');
    foreach($menu as $key => $value){
        if($key == 'main_page'){
            /* Добавляем стили только на главную страницу. */
            add_action('admin_print_styles-'.$value, 'print_styles');
        }
        /* Добавляем скрипты на все страницы админки. */
        add_action('admin_print_scripts-'.$value, 'print_scripts');
    }
}
add_action('admin_menu', 'my_admin_pages');

Из документации:

admin_print_scripts в основном используется для вывода встроенного JavaScript. admin_print_scripts не следует использовать для подключения стилей или скриптов на страницах админки. Вместо этого используйте admin_enqueue_scripts.

То же самое относится и к admin_print_styles.

add_action( 'admin_menu', 'add_my_admin_menus' ); 

function add_my_admin_menus() {
    $GLOBALS['my_page'] = add_menu_page( 'Заголовок страницы', 'Заголовок меню', MY_ADMIN_CAPABILITY, 'menu-slug', 'show_page_content');
    add_action( 'admin_enqueue_scripts', 'enqueue_admin_js');
}

function enqueue_admin_js($hook) {
    if($GLOBALS['my_page'] === $hook) {
        wp_enqueue_script( 'jquery-ui-core' );
        wp_enqueue_script( 'jquery-ui-tabs' );
        // Разве не удобно использовать зависимости и уже зарегистрированные основные JS-файлы?
        wp_enqueue_script( 'my-script', INCLUDES_URI . '/js/my_script.js', array( 'jquery-ui-core', 'jquery-ui-tabs' ) );
    }
}