Как подключить свои css-стили в админке сайта?

Свои css-стили в админке

Есть два различных способа подключить свои css-стили в админке сайта. Первый способ заключается в использовании встроенных стилей (inline css), для него вам необходимо добавить в файл functions.php вашей темы следующий код:

//inline подключение стилей в админке start
function wph_inline_css_admin() {
echo '<style>
  #show-settings-link {
    background: yellow;
    color:green!important;
  } 
 </style>';
}
add_action('admin_head', 'wph_inline_css_admin');
//inline подключение стилей в админке end

Этот код покрасит кнопку "Настройки экрана" в желтый цвет (просто ради примера).

Использование встроенных стилей уместно только при небольших хаках в админке сайта, а для чего-то большего (например, для подключения стилей темы или плагина) правильнее будет использовать внешний css-файл со стилями. Для этого вам надо использовать примерно такой код:

//внешний файл стилей в админке из папки темы start
function wph_add_css_file_admin() {
    $themeurl = get_bloginfo('stylesheet_directory');
    echo '<link rel="stylesheet" href="'.$themeurl.'/myfile.css" 
    type="text/css" media="all" />';
}
add_action('admin_head', 'wph_add_css_file_admin');
//внешний файл стилей в админке из папки темы end

Данный сниппет подключит в админке сайта внешний файл стилей myfile.css, который будет взят из папки текущей темы. Если вам необходимо подключить файл стилей из папки плагина, то используйте такой код:

//внешний файл стилей в админке из папки плагина start
function wph_add_css_file_admin() {
    $purl = plugins_url() . '/plugindir/';
    echo '<link rel="stylesheet" href="'.$purl.'myfile.css" 
    type="text/css" media="all" />';
}
add_action('admin_head', 'wph_add_css_file_admin');
//внешний файл стилей в админке из папки плагина end

Где 'plugindir' это папка вашего плагина. Есть еще один вариант подключения файла стилей, который считается более корректным:

//внешний файл стилей в админке из папки плагина start
function wph_add_css_file_admin() {
    $purl = plugins_url() . '/plugindir/';
    wp_register_style('myfile', $purl . 'myfile.css');
    wp_enqueue_style('myfile');
}
add_action('admin_enqueue_scripts', 'wph_add_css_file_admin');
//внешний файл стилей в админке из папки плагина end

Но по сути разницы почти никакой нет.

Админка admin_enqueue_scripts, admin_head

Написать комментарий

Главная

Админка

Как подключить свои css-стили в админке сайта?