WordPress 美化后台登录页面

Tuesday, August 17th, 2010 at 01:47 久酷

万戈老兄还有小邪都在美化后台登录页面，咱也不落后了，来玩玩！

先来看看我的后台登录页面，地址是：http://www.jiucool.com/wp/wp-login.php无视IE，非IE均可(Opera、firefox OR chrome)

截图(点击查看大图)：

其中借用了冰剑同学博客的背景图一用，看起来比原来的好看些了吧！

好了，下面来看步骤（部分直接调用的小邪的）：

第一步,将下面代码拷贝到主题的function.php里

function custom_login() {
  echo '<link rel="stylesheet" type="text/css" href="'.get_bloginfo('template_directory').'/mylogin_jiucool.css" />'."\n";
}
add_action('login_head', 'custom_login');

下面是mylogin_jiucool.css代码（注意其中值为0的属性不能删掉！）：

#login{
	margin:12em auto 8em auto;
	background:none no-repeat scroll center top #fff;
	border-radius:11px;
	-moz-border-radius:11px;
	-webkit-border-radius:11px;
	-moz-box-shadow:0 4px 18px #C8C8C8;
	border:1px solid #E5E5E5;
	font-weight:normal;
	}
form {
	-webkit-box-shadow: #C8C8C8 0px 0px 0px;
	border-radius: 0px;
	-moz-border-radius:0px;
	-moz-box-shadow:0 0px 0px #C8C8C8;
	background:none repeat scroll 0 0 #FFFFFF;
	border:0;
	font-weight:normal;
	margin-left:18px;
	margin-right:18px;
	margin-top:8px;
	padding:16px 16px 40px;
}
#login_error .message {
	-moz-border-radius:3px;
	border-style:solid;
	border-width:1px;
	margin:10px 8px 16px 8px;
	padding:12px;
}
h1 {
	display: none;
}
.login #nav a {
	color: #000 !important;
}
.login {
	background:url("http://www.jiucool.com/wp/wp-content/themes/green-bamboo/bg_night.jpg") no-repeat scroll center top #191931;
	height:959px;
}
.login #backtoblog a {
	color:#fff;
}
#backtoblog {
	background: #191931;
	border-bottom:0;
	height:30px;
	left:0;
	position:absolute;
	top:0;
	width:100%;
}
.button-primary {
	background: #AAA !important;
	border-color: #999 !important;
	text-shadow: none !important;
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}

以上代码直接ctrl+c crtl+v 可用！

标签:WordPress, wordpress登录美化, 后台, 后台美化, 美化分类：WordPress

No related posts.

21 Responses to “WordPress 美化后台登录页面”

阿邙 says:

August 18, 2010 at 06:17

我一向凭借cookie进入后台不过这个给客户做网站的话能用到哈

[Reply]
Timothy says:

August 18, 2010 at 00:07

不错，准备剽窃到我后台去……

[Reply]
zwwooooo says:

August 17, 2010 at 23:15

挺不错，那是嘀咕官方的背景图吧

[Reply]
小邪 says:

August 17, 2010 at 19:48

嘿嘿，还是这个够漂亮 ~
我的就太死板鸟 ~
。。话说万戈那个光说不练的家伙，应该拖出去切jj ~

[Reply]
久酷 Reply:
August 17th, 2010 at 20:01
@小邪, 哈哈大家赶紧换

[Reply]
冰剑 says:

August 17, 2010 at 17:18

其实也不是我的，我是从嘀咕那偷来的。。

[Reply]
A.shun says:

August 17, 2010 at 15:45

好卡通小盆友估计爱了

当然，也很养眼

[Reply]
万戈 says:

August 17, 2010 at 13:25

难怪这背景图眼熟呢，原来是冰剑小盆友的，8错呀，很有意境
大家都在搞后台，MS我只说不练，回去要加把劲，也搞一个去

[Reply]
久酷 Reply:
August 17th, 2010 at 15:20
@万戈, 我偷偷到你后台登陆页面看了看，确实没啥变化呢，哈哈

[Reply]
QiQiBoY says:

August 17, 2010 at 12:47

额。。其实我登陆界面很早就改过，只不过是简单的将wordpress logo换成了我自己的。。。

[Reply]
掌柜的马甲 says:

August 17, 2010 at 10:50

很有感觉,不客气的拿走了~

[Reply]
sayisee says:

August 17, 2010 at 08:02

占个沙发，博客圈中久酷更新的频率那是相当快了，哈哈，后台自己看，无所谓了。

[Reply]
久酷 Reply:
August 17th, 2010 at 08:58
@sayisee, 纯粹属于自娱自乐，

[Reply]