Customizing the Customizer | WordPress.org

Hi, @amosbenny001
You can search for How to add CSS to WP Dashboard and you’ll find a few options.
Here’s two of them:

  1. Add this in your (child) theme’s functions.php file:
    add_action('admin_head', 'my_custom_fonts');
    
    function my_custom_fonts() {?>
     <style>
        Your CSS rules here. 
      </style>
    <?php
    }
  2. Use a plugin like this one: https://wordpress.org/plugins/add-admin-css/

I didn’t mention any CSS code. Let me know if you need help finding the right CSS selectors for the element you want to customize.

Hope this helps,
Kind regards!

Also, on yourdomain.com/wp-admin/profile.php you can change the color scheme but that is user defined, so if you want to make a change for all users, use the above method.

Hi, thank you for the response! I tried to do similar things via plugin to add CSS in admin area. It doesn’t work.

I just tried to follow your approach, adding the below code in my functions.php. It doesn’t seem to work either.

add_action('admin_head', 'my_custom_fonts');

function my_custom_fonts() {?>
 <style>
    .customize-pane-parent li * {
      color: red !important;
    }
  </style>
<?php
}

I tried this CSS code in browser console. If it worked, the title text in the customizer should go red.

AND WOW!! My last try with admin_init works! Not sure if it’s the best way. Thank you for the advice!!!

  • This reply was modified 3 days, 5 hours ago by amosbenny001.

If it works and doesn’t break anything then it’s the best way 🤭

So just for future reference, you used add_action('admin_init','') instead of add_action('admin_head','') and this works?

Maybe Customizer needs the CSS to load earlier, I am not sure.

Yes. I used admin_init hook instead of admin_head hook and it works. Thank you!

To be verbose, the below code changes the font color of the customizer:

add_action('admin_init', 'my_custom_fonts');

function my_custom_fonts() {?>
 <style>
    .customize-pane-parent li * {
      color: red !important;
    }
  </style>
<?php
}

Awesome! Happy to help, glad it works!
We both learned something new today 😊



Source link