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; }
add_action('login_head', 'custom_loginlogo');

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


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); }
add_action('login_head', 'custom_loginlogo');
| improve this answer | |
  • for extra up votes, could you explain why this fixes the issue? – Tom J Nowell Apr 7 '14 at 18:20

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() { 
        $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%;
add_action( 'login_enqueue_scripts', 'my_login_logo' );
| improve this answer | |

Put it at the bottom of your theme function.php file before closing php sign ?> (if there is one).

function change_my_wp_login_image() {
   echo ”
   body.login #login h1 a {
   background: url(‘”.get_bloginfo(‘template_url’).”/images/your_image_name‘) 8px 0 no-repeat transparent;
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’);
| improve this answer | |
  • The quotes are messed up - will break the code. Also some of your comments are not in English and only a minority will understand them. Then there's the problem that some of your brackets are misplaced, etc. – kaiser Jan 14 '15 at 4:47

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.