Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

After modifying the code in my functions.php file to display a different logo on my login page, I'm getting a blank square instead.

I've added a custom .png image (326x67) to my (child) theme's image folder, and the code I've added to functions.php is as follows:

function custom_loginlogo() {
    echo '<style type="text/css">
    h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
    </style>';
}
add_action('login_head', 'custom_loginlogo');

Could it be a permissions problem (like an .htaccess file blocking the image)?

share|improve this question
add comment

3 Answers

up vote 1 down vote accepted

If you are using a child theme then maybe you should try the following code. Not necessary to put !important too unless some other plugin or code is overwriting it.

function custom_loginlogo() {
    echo '<style type="text/css">
    h1 a { background-image: url('.  get_stylesheet_directory_uri().'/images/login_logo.png); }
    </style>';
}
add_action('login_head', 'custom_loginlogo');
share|improve this answer
    
Fantastic, thank you. –  Teknophilia Dec 10 '11 at 3:44
    
for extra up votes, could you explain why this fixes the issue? –  Tom J Nowell Apr 7 at 18:20
add comment

I like to use something like this and just edit the css depending on how the logo looks:

Added into functions.php

/** Change Login Image **/
function my_login_logo() { 
    if(file_exists(TEMPLATEPATH.'/images/logo.png'))
        $logo = '/images/logo.png';
    else if(file_exists(TEMPLATEPATH.'/images/logo.jpg'))
        $logo = '/images/logo.jpg';
    else if(file_exists(TEMPLATEPATH.'/images/logo.gif'))
        $logo = '/images/logo.gif';
?>
    <style type="text/css">
        body.login div#login h1 a {
            background-image: url(<?php echo get_bloginfo('template_directory').$logo; ?>);
            background-size: auto;
            width: 330px;
            height: 75px;
            margin-bottom: -15px;
            margin-left: -4%;
        }
    </style>
<?php 
}
add_action( 'login_enqueue_scripts', 'my_login_logo' );
share|improve this answer
add comment

Put it at the bottom of your theme function.php file before closing php sign ?>

function change_my_wp_login_image() {
   echo ”
   <style>
   body.login #login h1 a {
   background: url(‘”.get_bloginfo(‘template_url’).”/images/your_image_name‘) 8px 0 no-repeat transparent;
   background-position:center;
   height:100px;
   width:320px;
   background-color:#E48C07;
}
</style>
“;
}
add_action(“login_head”, “change_my_wp_login_image”);

//logo url website
// verander de url op de login pagina
function put_my_url(){
   return (‘your_website_URL‘);
}
add_filter(‘login_headerurl’, ‘put_my_url’);

// changing the login page URL hover text
function put_my_title(){
   return (‘Your_Website_title‘);
}
add_filter(‘login_headertitle’, ‘put_my_title’);

with a demo reference here wp logo change

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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