不用插件也可以定制WordPress登陆注册页面,样式会存放在主题文件夹中,即使WordPress升级,也不会破坏定制好的样式。
方法概述
1. 通过钩子在登陆/注册页面引入自定义样式表,修改基本信息,这些在主题的functions.php中完成。
2. 在自定义样式表中写样式覆盖默认的样式,达到更改界面的目的。
编辑主题的functions.php
1. 增加自定义样式表function custom_login() {
echo '';
}
add_action('login_head', 'custom_login');
在主题目录下创建一个目录叫custom-login,在该目录下创建一个名为custom-login.css的文件,创建一个images文件夹存放图片。
2.更改logo的url,默认指向wordpress.orgfunction custom_headerurl( $url ) {
return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'custom_headerurl' );
3.更改logo的title,默认是“Powered by WordPress”(基于WordPress)function custom_headertitle ( $title ) {
return __( '欢迎来到Sola的博客' );
}
add_filter('login_headertitle','custom_headertitle');
4.在登陆表单中添加信息.function custom_login_message() {
echo '
' . __('欢迎来到Sola的博客,请登录后下载本站资源');
}
add_action('login_form', 'custom_login_message');
5.添加自定义HTML,例如增加版权信息function custom_html() {
echo '
© ' . get_bloginfo(url);
}
add_action('login_footer', 'custom_html');
编辑custom-login.css
例如更改背景图片,在custom-login.css中添加如下内容body.login{
background:url(images/bg.png) 0 0 no-repeat;
}
更改logo图片.login h1 a {
background:url(images/logo-login.png) no-repeat;
}
使用文字作为logo.login h1 a {
background:none;
text-indent:inherit;
display:inline;
}
自定义登陆界面实例
效果如图所示
个性登陆界面设计