Enable user login with phone number stored in user_meta – WordPress

In my wordpress, I want to add one functionality is:

  • User can login by their Phone number which is stored in ‘pcplugin-phone’ user meta key.
  • I’ve tried ‘authenticate’ filter hook but it’s not working.
  • For login page styling I am using Loginpress
  • Also I’ve putted php code in by creating a plugin of it.
  • Error which I am getting: Invalid username, email address or incorrect password.

Can someone help to fix?

if ( ! defined( 'ABSPATH' ) ) {
    exit; // Exit if accessed directly.
}

// Hook into the authenticate filter to modify the login process
add_filter( 'authenticate', 'phone_number_login_authenticate', 30, 3 );

    function phone_number_login_authenticate( $user, $username, $password ) {
        // Check if the username is actually a phone number
        if ( is_numeric( $username ) ) {
            // Get the user by phone number
            $user = get_user_by_meta_data( 'pcplugin-phone', $username );
    
            // If user is found and password is correct, return the user object
            if ( $user && wp_check_password( $password, $user->user_pass, $user->ID ) ) {
                return $user;
            } else {
                return new WP_Error( 'invalid_login', __( '<strong>ERROR</strong>: Invalid phone number or password.', 'phone-number-login' ) );
            }
        }
    
        return $user;
    }
    
    // Function to get user by meta data
    function get_user_by_meta_data( $meta_key, $meta_value ) {
        global $wpdb;
    
        // Query to get the user ID by meta key and meta value
        $user_id = $wpdb->get_var( $wpdb->prepare(
            "SELECT user_id FROM $wpdb->usermeta WHERE meta_key = %s AND meta_value = %s",
            $meta_key,
            $meta_value
        ) );
    
        // If user ID is found, return the user object
        if ( $user_id ) {
            return get_user_by( 'ID', $user_id );
        }
    
        // If no user is found, return false
        return false;
    }

Login Form:

<form name="loginform" id="loginform" action="https://example.com/wp-login.php" method="post">
            <p>
                <label for="user_login">Username or Email Address</label>
                <input type="text" name="log" id="user_login" class="input" value="" size="20" autocapitalize="off" autocomplete="username" required="required">
            </p>

            <div class="user-pass-wrap">
                <label for="user_pass">Password</label>
                <div class="wp-pwd">
                    <div class="user-pass-fields"><input type="password" name="pwd" id="user_pass" class="input password-input" value="" size="20" autocomplete="current-password" spellcheck="false" required="required"><div class="loginpress-caps-lock">Caps Lock is on</div></div>
                    <button type="button" class="button button-secondary wp-hide-pw hide-if-no-js" data-toggle="0" aria-label="Show password">
                        <span class="dashicons dashicons-visibility" aria-hidden="true"></span>
                    </button>
                </div>
            </div>
                        <p class="forgetmenot"><input name="rememberme" type="checkbox" id="rememberme" value="forever"> <label for="rememberme">Remember Me</label></p>
            <p class="submit">
                <input type="submit" name="wp-submit" id="wp-submit" class="button button-primary button-large" value="Log In">
                                    <input type="hidden" name="redirect_to" value="https://example.com/wp-admin/">
                                    <input type="hidden" name="testcookie" value="1">
            </p>
        </form>