2

UPDATED: The solution is to use login_head if you need to overwrite – @Jevuska

After updating to WP 4.5 my styles to customize the login page do not overwrite the default WP styles. Here's my code:

function my_login_logo() { ?>
    <style type="text/css">
        .login h1 a {
            background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/assets/images/logo.png);
            padding-bottom: 30px;
            width: 297px;
            height: 64px;
            background-size: 297px;
        }
        .login form {
          -webkit-box-shadow: 0 1px 6px rgba(0,0,0,.4);
          box-shadow: 0 1px 6px rgba(0,0,0,.4);
        }

        .login label {
          color: #333;
        }

        .login #nav a {
          color: #007CAD;
        }

        body, html {
          background: #fff;
        }
    </style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );
  • 1
    in your case, use login_head if you need to overwrite – Jevuska Apr 15 '16 at 14:39
  • Thank you @Jevuska it is exactly what I was looking for. If you want, you can put your comment in an answer to close the thread. – Kevin Mamaqi Apr 16 '16 at 8:37
3

@Kevin, here a couple options how to overwrite css for login page.

Via login_enqueue_scripts

If you use this hook, you need to create css file the same path with functions.php, say login-style.css, add your code inside, change your property background-image like this background-image: url(assets/images/logo.png); ( make sure your path correct ), and add your function with wp_enqueue_style in functions.php. We use login as handle of login-style.css, and it will put your css after default WP styles.

add_action( 'login_enqueue_scripts', 'my_login_logo' );
function my_login_logo()
{
    wp_enqueue_style( 'login-custom-style', get_stylesheet_directory_uri(). '/login-style.css', array('login') );
}

Via login_head

Since you have php code inside your css, by use this hook, your inline css code will be put after default WP styles.

add_action( 'login_head', 'my_login_logo' );

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.