Customize Login Logo Without A Plugin

Community Forums Forums Design Tips and Tricks Customize Login Logo Without A Plugin

This topic is: not resolved

Tagged: ,

This topic contains 8 replies, has 5 voices, and was last updated by  Jon Weiss 2 years, 1 month ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #171

    Jon Weiss
    Moderator
    Post count: 14

    Add these lines of code in your functions.php:


    // Custom WordPress Login Logo
    function login_css() {
    wp_enqueue_style( 'login_css', get_stylesheet_directory_uri(). '/css/login.css' );
    }
    add_action('login_head', 'login_css');

    As you can see, I’ve chosen to create a new stylesheet file for the login form. Although I prefer to do it this way, you can use the stylesheet of your current theme and just skip the step above.

    Next, add the following to the stylesheet:


    #login h1 a {
    background-image: url("http://YOUR-WEBSITE.com/wp-content/themes/YOUR_THEME/images/custom_logo.png") !important;
    }

     


    • This topic was modified 2 years, 1 month ago by  Jon Weiss. Reason: Adjusted the code to work with newer versions of WP
    • This topic was modified 2 years, 1 month ago by  Jon Weiss. Reason: Adjusted the code to work with newer versions of WP
    #213

    Lindsey Riel
    Participant
    Post count: 1

    This is awesome, thank you for sharing :)

    #225

    Jon Weiss
    Moderator
    Post count: 14
    #245

    mediaguru
    Participant
    Post count: 56

    Very nice stuff indeed. Will be updating my code snippets list – Thanks Again and keep em coming :)

    #246

    Lindsey Riel
    Participant
    Post count: 1

    I tried adding this code this evening and was unable to get it to work.

    #254

    Jon Weiss
    Moderator
    Post count: 14

    That’s weird. Did you add the style to your current stylesheet or to a new one? What’s the link where I can see your attempt?


    #262

    wpsmith
    Moderator
    Post count: 178

    Hello,

    You need to change get_template_directory_uri() to CHILD_URL or get_stylesheet_directory_uri()


    Travis Smith | Recommended StudioPress Developer & Contributor
    WP Smith | @wp_smith | GitHub

    Due to the forums, please paste code using Pastebin, JS Fiddle (for JavaScript) or GitHub.
    How to use Firebug for Designers by SixRevisions

    • This reply was modified 2 years, 1 month ago by  wpsmith.
    • This reply was modified 2 years, 1 month ago by  wpsmith.
    • This reply was modified 2 years, 1 month ago by  wpsmith.
    • This reply was modified 2 years, 1 month ago by  wpsmith.
    #265

    Seth
    Participant
    Post count: 18

    Here’s the code that I normally use to customize the login logo and it works pretty well.

    /******* Customize Login Logo ******/
    function my_custom_login_logo() {
    echo '
    h1 a { background-image:url('.get_bloginfo( 'stylesheet_directory' ).'/images/login-logo.png) !important; }
    ';
    }

    add_action( 'login_head', 'my_custom_login_logo' );

    function my_custom_login_url() {
    return site_url();
    }
    add_filter( 'login_headerurl', 'my_custom_login_url', 10, 4 );



    Digital marketing consultant. Entrepreneur. Small business crusader. Husband & Father. Roman Catholic. Athlete. Homebrewer. Backyard Vintner. Italophile.
    Website | Twitter | Facebook

    • This reply was modified 2 years, 1 month ago by  Seth.
    • This reply was modified 2 years, 1 month ago by  Seth. Reason: Code not displaying correctly
    • This reply was modified 2 years, 1 month ago by  Seth.
    • This reply was modified 2 years, 1 month ago by  Seth. Reason: Code not displaying correctly
    #282

    Jon Weiss
    Moderator
    Post count: 14

    Thanks for pitching in :). I pulled this one from my “archives” so I guess it’s a bit dated.I tweaked the code so it should work better now.

     

    There’s definitely a handful of ways to accomplish this, so keep in mind this is just one of many ways.


Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.