I would like to create my own reset password form and page, I mean this page:
I have already created a page template for the reset password form, the code:
<?php
/*
* Template Name: Page - Reset Password
*/
if( !is_user_logged_in() ) {
wp_redirect( site_url( 'login' ) );
}
get_header();
?>
<div id="content" class="content-area" role="main">
<div class="forms-wrapper">
<div class="form-reset-password-wrapper">
<h1>Reset your password</h1>
<form id="form-reset-password" name="resetpassform" class="form-reset-password" action="<?php echo site_url( '/wp-login.php?action=resetpass', 'https' ); ?>" method="post" autocomplete="off">
<input type="hidden" id="user_login" value="<?php echo $_GET['login']; ?>" autocomplete="off">
<p class="form-row">
<label for="user_pass">New password
<input type="password" name="user_pass" id="user_pass">
</p>
<p class="form-row">
<label for="user_pass_confirm">Confirm new password
<input type="password" name="user_pass_confirm" id="user_pass_confirm">
</p>
<p class="reset-password-submit">
<input type="submit" id="reset-password-btn" class="reset-password-btn" value="Submit"/>
</p>
<div class="form-reset-password-errors"></div>
</form>
</div>
</div>
</div>
<?php get_footer(); ?>
This is how it looks:
On form submit I fire a function using Ajax to validate these passwords and change them if everything goes well, so far so good.
How do people get to see this page? basically there is the request a password reset using email address form that looks like this:
After the email is received the user can click on a link that looks similar to this:
.php?action=rp&key=tkFUnvcJmhu30nRxqjpt&login=example%gmail
Now, in functions PHP I used this function to redirect users to my custom page with the $_GET
variables but it's not working, I need your help please! here is the code:
/*
* Redirect to custom reset password page
*/
function override_reset_password_form_redirect() {
$action = isset( $_GET['action'] ) ? $_GET['action'] : '';
$key = isset( $_GET['key'] ) ? $_GET['key'] : '';
$login = isset( $_GET['login'] ) ? $_GET['login'] : '';
if ( 'wp-login.php' === $GLOBALS['pagenow'] && ( 'rp' == $action || 'resetpass' == $action ) ) {
wp_redirect( site_url( '/reset-password/' ) . '?key=' . $key . '&login=' . $login );
exit;
}
}
add_action( 'init', 'override_reset_password_form_redirect' );
I would like to create my own reset password form and page, I mean this page:
I have already created a page template for the reset password form, the code:
<?php
/*
* Template Name: Page - Reset Password
*/
if( !is_user_logged_in() ) {
wp_redirect( site_url( 'login' ) );
}
get_header();
?>
<div id="content" class="content-area" role="main">
<div class="forms-wrapper">
<div class="form-reset-password-wrapper">
<h1>Reset your password</h1>
<form id="form-reset-password" name="resetpassform" class="form-reset-password" action="<?php echo site_url( '/wp-login.php?action=resetpass', 'https' ); ?>" method="post" autocomplete="off">
<input type="hidden" id="user_login" value="<?php echo $_GET['login']; ?>" autocomplete="off">
<p class="form-row">
<label for="user_pass">New password
<input type="password" name="user_pass" id="user_pass">
</p>
<p class="form-row">
<label for="user_pass_confirm">Confirm new password
<input type="password" name="user_pass_confirm" id="user_pass_confirm">
</p>
<p class="reset-password-submit">
<input type="submit" id="reset-password-btn" class="reset-password-btn" value="Submit"/>
</p>
<div class="form-reset-password-errors"></div>
</form>
</div>
</div>
</div>
<?php get_footer(); ?>
This is how it looks:
On form submit I fire a function using Ajax to validate these passwords and change them if everything goes well, so far so good.
How do people get to see this page? basically there is the request a password reset using email address form that looks like this:
After the email is received the user can click on a link that looks similar to this:
https://example/wp-login.php?action=rp&key=tkFUnvcJmhu30nRxqjpt&login=example%gmail
Now, in functions PHP I used this function to redirect users to my custom page with the $_GET
variables but it's not working, I need your help please! here is the code:
/*
* Redirect to custom reset password page
*/
function override_reset_password_form_redirect() {
$action = isset( $_GET['action'] ) ? $_GET['action'] : '';
$key = isset( $_GET['key'] ) ? $_GET['key'] : '';
$login = isset( $_GET['login'] ) ? $_GET['login'] : '';
if ( 'wp-login.php' === $GLOBALS['pagenow'] && ( 'rp' == $action || 'resetpass' == $action ) ) {
wp_redirect( site_url( '/reset-password/' ) . '?key=' . $key . '&login=' . $login );
exit;
}
}
add_action( 'init', 'override_reset_password_form_redirect' );
You can add the following to your functions.php
to achieve what you are after. The action init
doesn't seem to fire in time for what you are looking for.
if($_GET['action']==='rp' && strpos($_SERVER['REQUEST_URI'],'wp-login.php')) {
$key = isset( $_GET['key'] ) ? $_GET['key'] : '';
$login = isset( $_GET['login'] ) ? $_GET['login'] : '';
wp_redirect( site_url( '/reset-password/' ) . '?key=' . $key . '&login=' . $login );
exit;
}