挂件头衔✨️靓标库🧚‍♂️名人堂🦄宝可梦🍎水果机🥊猜拳🏧黑市🏧银行💹抽奖
   🎁
返回列表 发布新帖
查看: 401|回复: 1

[代码技巧] 美化WordPress默认登录页

[复制链接]
社区贡献

331

主题

204

回帖

2万

积分

等级头衔
Icon组别 : 管理员
Icon等级 :

积分成就
   钻石 : 293 颗
   贡献 : 40842 点
   金币 : 24 枚
Icon在线时间 : 1696 小时
Icon注册时间 : 2024-11-22
Icon最后登录 : 2026-6-11

荣誉勋章

连续签到LV.1累计签到LV.3任务·年会员幸运抽奖·皇幸运抽奖·尊幸运抽奖·豪起源之星摩羯座推广LV.2钻石LV.1注册一周年

总共送礼:1 个    总共收礼:0 个

实力·绝代收藏家

飞流名人堂成员 1 FLLTCN 实名认证 特邀大神 诚信商家 信誉担保 精华作者+ 官方团队 vip vip-year 发表于 2025-4-29 23:33:26 来自手机端 | 查看全部 |阅读模式 北京

交易无需等待,成交就是现在,全面资源整合网络大咖云集,让你轻松玩转互联网!

您需要 登录 才可以下载或查看,没有账号?立即注册

×
1000175603.webp
将下面的代码添加到WordPress主题的“functions.php”文件中即可。
PHP代码:
  1. /**
  2. * 美化Wordpress登录页 By 一为
  3. * 原文地址:https://www.iowen.cn/chundaimameihuawordpressmorendengluye/
  4. */
  5. function io_login_header(){
  6.     echo '<div class="login-container">
  7.     <div class="login-body">
  8.         <div class="login-img shadow-lg position-relative flex-fill">
  9.             <div class="img-bg position-absolute">
  10.                 <div class="login-info">
  11.                     <h2>'. get_bloginfo('name') .'</h2>
  12.                     <p>'. get_bloginfo('description') .'</p>
  13.                 </div>
  14.             </div>
  15.         </div>';
  16. }

  17. function io_login_footer(){
  18.     echo '</div><!--login-body END-->
  19.     </div><!--login-container END-->
  20.     <div class="footer-copyright position-absolute">
  21.             <span>Copyright © <a href="'. esc_url(home_url()) .'" class="text-white-50" title="'. get_bloginfo('name') .'" rel="home">'. get_bloginfo('name') .'</a></span>
  22.     </div>';
  23. }
  24. add_action('login_header', 'io_login_header');
  25. add_action('login_footer', 'io_login_footer');


  26. //登录页面的LOGO链接为首页链接
  27. add_filter('login_headerurl',function() {return esc_url(home_url());});
复制代码

CSS代码:
  1. /**
  2. * 美化Wordpress登录页 By 一为
  3. * 原文地址:https://www.iowen.cn/chundaimameihuawordpressmorendengluye/
  4. */
  5. function custom_login_style(){
  6.     $login_color = io_get_option('login_color',array('color-l'=>'','color-r'=>''));
  7.     echo '<style type="text/css">
  8.     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}
  9.     .login h1 a{background-image:url('.io_get_option('logo',get_template_directory_uri() .'/images/logo.png').');width:180px;background-position:center center;background-size:'.io_get_option('login_logo_size',160).'px}
  10.     .login-container{position:relative;display:flex;align-items:center;justify-content:center;height:100vh}
  11.     .login-body{position:relative;display:flex;margin:0 1.5rem}
  12.     .login-img{display:none}
  13.     .img-bg{color:#fff;padding:2rem;bottom:-2rem;left:0;top:-2rem;right:0;border-radius:10px;background-image:url('.io_get_option('login_ico',get_template_directory_uri() .'/images/login.jpg').');background-repeat:no-repeat;background-position:center center;background-size:cover}
  14.     .img-bg h2{font-size:2rem;margin-bottom:1.25rem}
  15.     #login{position:relative;background:#fff;border-radius:10px;padding:28px;width:280px;box-shadow:0 1rem 3rem rgba(0,0,0,.175)}
  16.     .flex-fill{flex:1 1 auto}
  17.     .position-relative{position:relative}
  18.     .position-absolute{position:absolute}
  19.     .shadow-lg{box-shadow:0 1rem 3rem rgba(0,0,0,.175)!important}
  20.     .footer-copyright{bottom:0;color:rgba(255,255,255,.6);text-align:center;margin:20px;left:0;right:0}
  21.     .footer-copyright a{color:rgba(255,255,255,.6);text-decoration:none}
  22.     #login form{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;border-width:0;padding:0}
  23.     #login form .forgetmenot{float:none}
  24.     .login #login_error,.login .message,.login .success{border-left-color:#40b9f1;box-shadow:none;background:#d4eeff;border-radius:6px;color:#2e73b7}
  25.     .login #login_error{border-left-color:#f1404b;background:#ffd4d6;color:#b72e37}
  26.     #login form p.submit{padding:20px 0 0}
  27.     #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}
  28.     #login form input{box-shadow:none!important;outline:none!important}
  29.     #login form p.submit .button-primary:hover{background-color:#444}
  30.     .login #backtoblog,.login #nav{padding:0}
  31.     @media screen and (min-width:768px){.login-body{width:1200px}
  32.     .login-img{display:block}
  33.     #login{margin-left:-60px;padding:40px}
  34.     }
  35. </style>';
  36. }
  37. add_action('login_head', 'custom_login_style');
复制代码

添加完上面两段代码就可以使用美化的登录页了,就这么简单,赶紧试试吧。

移除 WordPress 5.9 登录页面中的语言切换框
1000175604.webp
将下面的代码添加到WordPress主题的“functions.php”文件中
  1. add_filter( 'login_display_language_dropdown', '__return_false' );
复制代码
路虽远,行则将至;事虽难,做则必成。
社区贡献

68

主题

1175

回帖

3万

积分

等级头衔
Icon组别 : 银河会员
Icon等级 :

积分成就
   钻石 : 1 颗
   贡献 : 14155 点
   金币 : 0 枚
Icon在线时间 : 1444 小时
Icon注册时间 : 2024-11-30
Icon最后登录 : 2026-6-2

荣誉勋章

经验·剑士经验·骑士经验·领主无名の勋章国庆节中秋节七夕节

总共送礼:0 个    总共收礼:0 个
柒沐 777 vip vip-year 发表于 2025-4-30 06:20:47 来自手机端 | 查看全部 福建厦门
感谢分享,飞流有你更精彩!
企鹅(VX):550577777
数字飞扬,卓越一流。(官Q群123129)
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

飞流广播+ 发布

系统消息:飞流安卓客户端APP已上线,请在QQ群(123129)群文件内获取下载。
02-21 02:22
01-24 12:40
站内通告

📢 六月份后均不在线,请悉知

提供资源交易、信息共享、靓号交流、技术变现、学习问答、兴趣娱乐等全面服务。

1.丰富功能系统,扩展社区特色玩法,打造最好的互联网聚集圈子。

2.准确信息真实交易,安全快捷又方便,让虚拟交易面对面。

3. 天上不会掉馅饼,话术骗术迷人心,切勿脱离平台线下交易,被骗与平台无关!

4. 欺诈骗钱,违规违法将视情受到警告&禁言&封号甚至检举至👮🏻‍♀️处理!

官方Q群:1003810038钉推群:BAYR2383 站长QQ:3388700000

飞流论坛(FLLT.CN),一个专注于资源信息发布、虚拟网络交易、技术学习与娱乐社交的交流平台。
  • 钉钉新帖推送群
  • 官方交流QQ群
  • 站长唯一微信号

💥客户端|🧿小黑屋|📴手机页|飞流网 |网站地图

GMT+8, 2026-6-12 07:24 , Processed in 0.084102 second(s), 84 queries, MemCached On , Gzip On.

飞流论坛 HanAnalytics icp

Copyright © 2024-2026 飞流网 版权所有 All Rights Reserved. X3.5

快速回复 返回顶部 返回列表