WordPress 纯代码美化默认登录页面

function io_login_header(){echo '<div class="login-container"><div class="login-body"><div class="login-img shadow-lg position-relative flex-fill"><div class="img-bg position-absolute"><div class="login-info"><!--<h2 id='pk-menu-0'>'. get_bloginfo('name') .'</h2>--><!-- '. get_bloginfo('description') .' --></div></div></div>';}function io_login_footer(){echo '</div><!--login-body END--></div><!--login-container END--><div class="footer-copyright position-absolute">Copyright © <a class="text-white-50" title="'. get_bloginfo('name') .'" href="'. esc_url(home_url()) .'" rel="home" target="_blank" rel="nofollow" >'. get_bloginfo('name') .'</a></div>';}add_action('login_header', 'io_login_header');add_action('login_footer', 'io_login_footer');//登录页面的LOGO链接为首页链接add_filter('login_headerurl',function() {return esc_url(home_url());});function custom_login_style(){$login_color = array('color-l' =&gt; '#293dd9', 'color-r' =&gt; '#df231a');//$login_color = array('color-l' =&gt; '#ac1392', 'color-r' =&gt; '#7431d2');// logo 路径$login_logo = './logo.png';// logo 尺寸$login_logo_size = 200;// 背景图片路径$login_ico = './beijing.jpg';echo '<style type="text/css">body{background:'.$login_color['color-l'].';background:-o-linear-gradient(45deg,'.$login_color['color-l'].','.$login_color['color-r'].');background:linear-gradient(45deg,'.$login_color['color-l'].','.$login_color['color-r'].');height:100vh}<br />.login h1 a{background-image:url('.$login_logo.');width:180px;background-position:center center;background-size:'.$login_logo_size.'px}<br />.login-container{position:relative;display:flex;align-items:center;justify-content:center;height:100vh}<br />.login-body{position:relative;display:flex;margin:0 1.5rem}<br />.login-img{display:none}<br />.img-bg{color:#fff;padding:2rem;bottom:-2rem;left:0;top:-2rem;right:0;border-radius:10px;background-image:url('.$login_ico.');background-repeat:no-repeat;background-position:center center;background-size:cover}<br />.img-bg h2{font-size:2rem;margin-bottom:1.25rem}<br />#login{position:relative;background:#fff;border-radius:10px;padding:28px;width:280px;box-shadow:0 1rem 3rem rgba(0,0,0,.175)}<br />.flex-fill{flex:1 1 auto}<br />.position-relative{position:relative}<br />.position-absolute{position:absolute}<br />.shadow-lg{box-shadow:0 1rem 3rem rgba(0,0,0,.175)!important}<br />.footer-copyright{bottom:0;color:rgba(255,255,255,.6);text-align:center;margin:20px;left:0;right:0}<br />.footer-copyright a{color:rgba(255,255,255,.6);text-decoration:none}<br />#login form{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;border-width:0;padding:0}<br />#login form .forgetmenot{float:none}<br />.login #login_error,.login .message,.login .success{border-left-color:#40b9f1;box-shadow:none;background:#d4eeff;border-radius:6px;color:#2e73b7}<br />.login #login_error{border-left-color:#f1404b;background:#ffd4d6;color:#b72e37}<br />#login form p.submit{padding:20px 0 0}<br />#login form p.submit .button-primary{float:none;background-color:#f1404b;font-weight:bold;color:#fff;width:100%;height:40px;border-width:0;text-shadow:none!important;border-color:none;transition:.5s}<br />#login form input{box-shadow:none!important;outline:none!important}<br />#login form p.submit .button-primary:hover{background-color:#444}<br />.login #backtoblog,.login #nav{padding:0}<br />@media screen and (min-width:768px){.login-body{width:1200px}<br />.login-img{display:block}<br />#login{margin-left:-60px;padding:40px}<br />}<br /></style>';}add_action('login_head', 'custom_login_style');