Password Reset Page

Help users quickly and securely reset their passwords with a well-designed password reset experience.

Password reset form styling inherits from login customization

Overview

WordPress includes a built-in password reset system. When users forget their passwords, they request a reset link via email. BuddyX Pro lets you customize how the password reset form looks to match your login page branding.

How Password Reset Works

The User Journey

1. User clicks “Lost your password?” on the login page
2. Enters their username or email on the reset form
3. Receives an email with a password reset link
4. Clicks the link in the email
5. Enters a new password on the reset page
6. Logs in with the new password

What You Can Customize

BuddyX Pro provides customization options for the visual appearance of the password reset form, which inherits most styling from your login page settings.

Customization Options

Password Reset Form Styling

When you enable custom login in BuddyX Pro, the password reset page automatically uses your login page theme. You can further customize the “Lost Password” form specifically.

Location: Appearance → Customize → Site Settings → Login Customization → Forget Form

Note: These settings only appear when:

1. Enable Custom Login is turned ON
2. Choose Theme is enabled
3. Enable Form Transparency is turned OFF

Inherited Settings

The password reset form automatically inherits these styles from your login page:

From Login Form Settings:

• Form width
• Form minimum height
• Form border radius
• Form shadow and shadow opacity
• Form padding
• Input field styling (background, text, border colors)
• Input field dimensions
• Label colors and sizes
• Link colors

From Button Settings:

• Button background and border colors
• Button hover states
• Button text colors
• Button dimensions and padding
• Button border radius and shadow

From Background Settings:

• Page background (image, color, or video)
• Background gallery selection

This means you typically don’t need to configure the password reset form separately—it automatically matches your login page design.

Configuration Examples

Example 1: Distinct Reset Form

Create a visually different password reset form to help users understand they’re on a different page.

Settings:

• Background Image: Upload a distinct image (e.g., lock icon, security theme)
• Background Color: Leave empty or use complementary color

Use Case: When you want users to clearly know they’re resetting their password, not logging in.

Example 2: Consistent Branding

Keep the reset form identical to the login form for brand consistency.

Settings:

• Leave Background Image and Background Color empty
• Form automatically uses login page styling

Use Case: Maintain seamless brand experience across all authentication pages.

Example 3: High Security Feel

Emphasize security on the password reset page.

Settings:

• Background Image: Security-themed image (shield, lock, key)
• Background Color: Darker shade of your brand color

Use Case: Financial services, healthcare, or any security-sensitive application.

Password Reset Email

While BuddyX Pro customizes the visual appearance of the reset form, WordPress handles the password reset email. You can customize these emails using plugins or code.

Default Email Content

WordPress sends a plain-text email containing:

• Site name
• Username
• Password reset link (expires in 24 hours)
• Login URL
• Note that the email was automatically generated

Customizing Reset Emails

To customize the password reset email, you have several options:

Option 1: Email Customizer Plugins

Use plugins designed for WordPress email customization:

WP Mail SMTP

• Customize email sender name and address
• Add logo to emails
• Style with HTML templates

Email Templates by Kadence WP

• Visual email designer
• Pre-built templates
• Custom branding

BuddyPress (if installed)

• Built-in email customizer
• Navigate to Settings → BuddyPress → Emails
• Customize all BuddyPress-related emails

Option 2: Custom Code

Add to your child theme’s functions.php or a custom plugin:

/**
 * Customize password reset email subject
 */
add_filter( 'retrieve_password_title', function( $title, $user_login, $user_data ) {
  return sprintf( '[%s] Reset Your Password', get_bloginfo( 'name' ) );
}, 10, 3 );

/**
 * Customize password reset email message
 */
add_filter( 'retrieve_password_message', function( $message, $key, $user_login, $user_data ) {
  $message = sprintf( __( 'Hello %s,' ), $user_login ) . "\r\n\r\n";
  $message .= __( 'Someone requested a password reset for your account. If this was you, click the link below:' ) . "\r\n\r\n";
  $message .= network_site_url( "wp-login.php?action=rp&key=$key&login=" . rawurlencode( $user_login ), 'login' ) . "\r\n\r\n";
  $message .= __( 'If you did not request this, please ignore this email.' ) . "\r\n\r\n";
  $message .= sprintf( __( 'Thanks, %s Team' ), get_bloginfo( 'name' ) ) . "\r\n";

  return $message;
}, 10, 4 );

Option 3: HTML Email Templates

For styled HTML emails, use this code:

/**
 * Send password reset email as HTML
 */
add_filter( 'wp_mail_content_type', function( $content_type ) {
  if ( did_action( 'retrieve_password' ) ) {
    return 'text/html';
  }
  return $content_type;
} );

/**
 * Customize HTML password reset email
 */
add_filter( 'retrieve_password_message', function( $message, $key, $user_login, $user_data ) {
  $reset_url = network_site_url( "wp-login.php?action=rp&key=$key&login=" . rawurlencode( $user_login ), 'login' );

  ob_start();
  ?>
  

    
Password Reset Request
    
Hello ,
    
Someone requested a password reset for your account on .
    

      "
         style="background-color: #0073aa; color: white; padding: 12px 24px;
                text-decoration: none; border-radius: 4px; display: inline-block;">
        Reset Password
      
    
    

      If you did not request this, please ignore this email. The link expires in 24 hours.
    
    

    

      This email was sent from 
    
  
  

add_filter( 'password_hint', function( $hint ) {
  return 'Password must be at least 12 characters with uppercase, lowercase, numbers, and symbols.';
} );

add_filter( 'login_redirect', function( $redirect_to, $requested_redirect_to, $user ) {
  // Check if this is after password reset
  if ( isset( $_GET['password'] ) && $_GET['password'] === 'changed' ) {
    return home_url( '/welcome/' );
  }
  return $redirect_to;
}, 10, 3 );

add_filter( 'password_reset_expiration', function() {
  return DAY_IN_SECONDS; // 24 hours (default)
  // return HOUR_IN_SECONDS * 2; // 2 hours
  // return DAY_IN_SECONDS * 2; // 48 hours
} );

// Add custom field to password reset form
add_action( 'lostpassword_form', function() {
  echo '
';
  echo 'Security Question: What is your favorite color?
';
  echo '';
  echo '
';
} );

// Verify security question
add_action( 'lostpassword_post', function( $errors ) {
  if ( empty( $_POST['security_answer'] ) ) {
    $errors->add( 'invalid_security', __( 'Please answer the security question.' ) );
  }

  // Add your verification logic here
  // Compare with stored answer in user meta
} );

add_action( 'after_password_reset', function( $user, $new_pass ) {
  // Log password reset
  error_log( sprintf(
    'Password reset for user: %s (ID: %d) at %s',
    $user->user_login,
    $user->ID,
    current_time( 'mysql' )
  ) );

  // Or save to custom table, send admin notification, etc.
}, 10, 2 );

add_filter( 'gettext', function( $translated_text, $text, $domain ) {
  if ( $text === 'Lost your password?' ) {
    return 'Forgot password?';
  }
  return $translated_text;
}, 10, 3 );

body.login #nav a {
  color: #your-color;
  font-weight: bold;
}
body.login #nav a:hover {
  color: #your-hover-color;
}

add_shortcode( 'custom_password_reset', function() {
  if ( is_user_logged_in() ) {
    return '
You are already logged in.
';
  }

  ob_start();
  ?>
  
">
    

      Username or Email

      
    
    
    

      
    
  
  

// Customize password reset for network
add_filter( 'retrieve_password_title', function( $title, $user_login, $user_data ) {
  $site_name = get_network()->site_name;
  return sprintf( '[%s] Password Reset', $site_name );
}, 10, 3 );

// Send from network admin email
add_filter( 'wp_mail_from', function( $email ) {
  if ( did_action( 'retrieve_password' ) ) {
    return get_network_option( null, 'admin_email' );
  }
  return $email;
} );