Wordpress - adding custom stylesheet to wp-admin

According to WordPress Codex (here):

admin_enqueue_scripts is the first action hooked into the admin scripts actions.

Example

Loading a CSS or JS files for all admin area:

    <?php
      //from functions.php

      //First solution : one file
      //If you're using a child theme you could use:
      // get_stylesheet_directory_uri() instead of get_template_directory_uri()
      add_action( 'admin_enqueue_scripts', 'load_admin_style' );
      function load_admin_style() {
        wp_register_style( 'admin_css', get_template_directory_uri() . '/admin-style.css', false, '1.0.0' );
//OR
        wp_enqueue_style( 'admin_css', get_template_directory_uri() . '/admin-style.css', false, '1.0.0' );
       }

      //Second solution : two or more files.
      //If you're using a child theme you could use:
      // get_stylesheet_directory_uri() instead of get_template_directory_uri()
      add_action( 'admin_enqueue_scripts', 'load_admin_styles' );
      function load_admin_styles() {
        wp_enqueue_style( 'admin_css_foo', get_template_directory_uri() . '/admin-style-foo.css', false, '1.0.0' );
        wp_enqueue_style( 'admin_css_bar', get_template_directory_uri() . '/admin-style-bar.css', false, '1.0.0' );
      }  

    ?>

do i have to create folder in my plugins named css or do i just copy my .css to the wp-admin/css directory?

No, put your CSS file together with the other, in your theme directory, then specify the path with:

get_template_directory_uri() . '/PATH_TO_YOUR_FILE'

For ex my file name is admin-style.css and i put it in a folder named css my path will looks like:

get_template_directory_uri() . '/css/admin-style.css'

Hope it helps!


If you want to make CSS changes for the admin panel. paste the below code in functions.php of your child theme

add_action('admin_head', 'my_custom_fonts'); // admin_head is a hook my_custom_fonts is a function we are adding it to the hook

function my_custom_fonts() {
  echo '<style>
    #posts-filter table.posts{
        table-layout:auto;   
    }
  </style>';
}

Tags:

Css

Wp Admin