1

I tried adding a custom CSS for my wp-login page and login forms within my website using the login_enqueue_scripts hook.

My issue is that my changes don't initially reflect on the front end. But the changes showed up the next day when I left it overnight. Why is this delay happening with this hook? Does it require a server restart to start showing the new style changes?

Following is the code I am using in my functions.php, as per this documentation.

function wpb_login_logo() { ?>
    <style type="text/css">
        #login h1 a, .login h1 a 
        {            
        background-image: url(/wp-content/uploads/2023/03/site-logo.png);
        width:300px;
        background-size: 300px auto;
        background-repeat: no-repeat;
        padding-bottom: 10px;
        }
        #login {
        border: 1px solid #c3c4c7;
        box-shadow: 0 1px 3px rgba(0,0,0,.04);
        background: #fff;
        }
        .login form {
            border: none;
            box-shadow: none;
        }
        input#wp-submit {
            font-size: clamp(100%,5vw,101%);
            border-radius: 3px;
            background: #e6e6e6;
            color: rgba(0, 0, 0, 0.8);
            line-height: 1;

            border: 1px px solid;
            border-color:darkgrey;
            text-transform: capitalize;
            transition: transform 200ms ease-in;
            text-transform: capitalize;
            cursor: pointer;
        }
        input#wp-submit:hover {
            transform: scale(1.1);
            color: #333333;
            transition: transform 200ms ease-in;
            background-color: inherit;
            z-index: 2; 
            width:1.1;
        }

    </style>
<?php }
add_action( 'login_enqueue_scripts', 'wpb_login_logo' );

function wpb_login_logo_url() {
return home_url();
}
add_filter( 'login_headerurl', 'wpb_login_logo_url' );

function wpb_login_logo_url_title() {
return 'New Site';
}
add_filter( 'login_headertitle', 'wpb_login_logo_url_title');

Edit: Turns out my issue was the LiteSpeed cache plugin. It got resolved as soon as I purged the cache. I am disabling the cache for the development server for now. 🤦🏽‍♂️

1 Answer 1

1

Edit: Turns out my issue was the LiteSpeed cache plugin. It got resolved as soon as I purged the cache. I am disabling the cache for the development server for now. 🤦🏽‍♂️

2
  • Yeah, one of my first rules of dev work is "cache nothing".
    – Pat J
    Commented Sep 23, 2023 at 15:50
  • Thank you. I will keep it in mind going forward.
    – Nalin Vyas
    Commented Oct 7, 2023 at 14:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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