如何更换WordPress后台登陆页面的背景图片和LOGO

前言：

有很多方法更换WordPress后台登陆页面的背景图片和LOGO。今天老猫主要介绍以下几种通用型的。

1、通过functions代码实现

//站长资料库调用bing美图作为登录页背景图
function custom_login_head(){
    $str=file_get_contents('http://cn.bing.com/HPImageArchive.aspx?format=js&idx=0&n=1');
    if (preg_match("/\/(.+?).jpg/", $str, $matches)) {
        $imgurl='http://s.cn.bing.net'.$matches[0];
    }
    echo'<style type="text/css">body{background: url('.$imgurl.');background-image:url('.$imgurl.');-moz-border-image: url('.$imgurl.');}</style>';
}
add_action('login_head', 'custom_login_head');

图片调用的BING搜索引擎。图片会每日自动更新，手动想更新图片的话，可以修改代码中 idx=0 的参数 0 为其他数字即可。
缺点就是只能更改背景图片。无法更换LOGO。

你不想调用其他地址的图片想本地化也可以看下面的方法。

先将以下代码放入functions

//去掉登录界面logo网址
    add_filter('login_headerurl', create_function(false,"return get_bloginfo( 'siteurl' );">));
//修改logo说明文字
    add_filter('login_headertitle', create_function(false,"return get_bloginfo( 'description' );">));
//添加登录页背景图
    function custom_login() {
    echo '<link rel="stylesheet" tyssspe="text/css" href="' . get_bloginfo('template_directory') . '/custom_login/custom_login.css" />>'; }
    add_action('login_head', 'custom_login');
 //替换logo
    function custom_loginlogo() {
    echo '<style type="text/css">
    h1 a {background:#00a67c url('.get_bloginfo('template_directory').'/img/logo.png) !important;}
    </style>';
    }
    add_action('login_head', 'custom_loginlogo');

然后写一个登录用CSS代码custom_login.css，把下面的代码放进去，把里面的网址修改成自己想要作为背景的图片地址！（PS:用作背景的图片最好是1920*1080以上分辨率的图片，否则图片平铺起来可能不是很美观）

    /** 背景及字体 **/
    html{
    background: transparent;
    }
    body.login{
    background: #fff url("https://www.itszl.com/XXXX.jpg");
    font: 14px 'Microsoft YaHei', Arial, Lucida Grande, Tahoma, sans-serif;
    }

    /** 去掉链接下划线 **/
    html a{
    text-decoration: none;
    }
    /** 登录DIV **/
    #login {
    background:#fff;
    border: 1px solid #ccc;
    width:400px;
    margin: 40px auto 0;
    padding: 10px 10px 20px 10px;
    border-radius:5px;
    box-shadow:0 4px 10px -1px rgba(200, 200, 200, 0.7);
    }
    /** 替换logo **/
    .login h1 a{
    background: #fff url(logo.png) no-repeat center;
    width:400px;
    }
    /** 提示 **/
    .updated, .login .message {
    background:#fff;
    border: none;
    text-align: center;
    }
    /** 表单 **/
    .login form {
    box-shadow:none;
    border: none;
    }
    #loginform, #registerform, #lostpasswordform{
    background:transparent;
    border:none;
    }
    /** 按钮 **/
    .button-primary,.submit .button-primary,#login form .submit input {
    width:83px;
    height:25px;
    font-weight: bold;
    border:none;
    }

2、通过插件实现

如果你嫌代码太麻烦。那么就用插件吧。Login Designer 这个插件简单轻便，没那么多花花肠子。在后台搜索Login Designer 或者去官方下载了后台上传或者解压了直接放入插件目录内都可以。