我想自定义我的WordPress登录表单。我是WP的新手,严格遵循此处描述的程序:https://themetrust.com/build-custom-wordpress-login-page/
。但我做了额外的小型定制:
require_once( explode( "wp-content" , __FILE__ )[0] . "wp-load.php" );
get_header(); ?>
<?php the_content(); ?>
<style>
.right{
position: absolute;
right: 532px;
width: 480px;
border: 3px solid #73AD21;
padding: 10px;
}
</style>
<?php
$args = array(
'echo' => true,
'redirect' => site_url( $_SERVER['REQUEST_URI'] ),
'form_id' => 'loginform',
'label_username' => 'Username',
'label_password' => 'Password',
'label_remember' => 'Remember Me',
'label_log_in' => 'Log In',
'id_username' => 'user_login',
'id_password' => 'user_pass',
'id_remember' => 'rememberme',
'id_submit' => 'wp-submit',
'remember' => true,
'value_username' => NULL,
'value_remember' => false
);
?>
<div>
<table class = "right" bgcolor="#cccccc">
<tr>
<td <p><a href="<?php get_template_directory_uri() .'/page-not-
member.php'; ?>">Not member yet</a></p></td><td></td><td></td>
</tr>
<tr>
<td colspan="2">Login:</td>
</tr>
<tr>
<td> <?php wp_login_form( array('redirect' => home_url()) ); ?> </td>
</tr>
<tr>
<td colspan="2"><a href="<?php get_template_directory_uri()
.'/zapomnij_formularz.php'; ?>">Forgot password?</a></td>
</tr>
</tr>
</table>
</div>
...我的登录页面如下:
http://ipic.su/img/img7/fs/image1.1499330136.jpg
如何将页面格式化(登录/密码输入字段对齐):http://ipic.su/img/img7/fs/image2.1499330556.jpg
?
Thank you in advance.
答案 0 :(得分:0)
你可以使用css.Below css是登录表单css。
以下是登录页面的一些有用的,高度特异性的CSS选择器:
body.login {}
body.login div#login {}
body.login div#login h1 {}
body.login div#login h1 a {}
body.login div#login form#loginform {}
body.login div#login form#loginform p {}
body.login div#login form#loginform p label {}
body.login div#login form#loginform input {}
body.login div#login form#loginform input#user_login {}
body.login div#login form#loginform input#user_pass {}
body.login div#login form#loginform p.forgetmenot {}
body.login div#login form#loginform p.forgetmenot input#rememberme {}
body.login div#login form#loginform p.submit {}
body.login div#login form#loginform p.submit input#wp-submit {}
body.login div#login p#nav {}
body.login div#login p#nav a {}
body.login div#login p#backtoblog {}
body.login div#login p#backtoblog a {}
对你而言我认为需要thione css
body.login div#login form#loginform input#user_pass {}
希望这有助于你