How to Display Frontend CSS for Administrator only

I’ve been asked to restyle the css of a WordPress website frontend.
The website can’t be in maintenance mode while working on it as it must stay up and running all the time.
I assume that if I can add a small and unobtrusive condition in the header allowing the administrator to see a different css file than the users, I could edit the css and test the result while the users still see the original version of the website.
This way I could work on the design without anyone noticing.

Can anyone tell me which WordPress function I should call on the header to switch the css file if and only if the user is an administrator?

Read More

The best would be not to edit the “functions.php” file or activate any plugin as I really don’t want to mess with the website as it is (few chances but chances anyway).
I would rather edit the “header.php” file in the theme folder in order to be sure nothing bad happens.

Thank you.

Related posts

Leave a Reply

1 comment

  1. You should be able to simply check the capabilities of the currently logged in user. If they’re an administrator the following example should do what you want it to. Just add this into your theme’s functions.php file.

    Please note this code is untested, but it should get you where you want to be. If the level_10 capability doesn’t work you can check out the documentation for other user levels and capabilities here.

    add_action( 'wp_enqueue_scripts', 'admin_only_stylesheet' );
    
    function admin_only_stylesheet() {
    
        if ( current_user_can('level_10') {
    
            wp_register_style( 'admin-only-style', get_template_directory_uri() . '/css/admin-frontend-style.css', array(), '12345678', 'all' );
    
            wp_enqueue_style( 'admin-only-style' );
    
        }
    
    }