如何在没有任何插件的情况下创建 WordPress 自定义登录弹出模式

登录第 1 步：
创建 cusom 登录表单短代码：

// custom sign in popup form shortcod
function custom_login_form() {

    // display the login form
    ob_start();

    ?>
    <form method="post" class="formvalidationquery login-form">
        <div class="form-group">
            <label for="">*user name</label>
            <input type="email" id="youremail" name="useremail" placeholder="email address" required />
            <span class="formerror" id="youremailerror"></span>
        </div>
        <div class="form-group">
        <label for="">*password</label>
            <input type="password" name="password" id="loginpassword" placeholder="password" required />
            <span class="formerror" id="loginpassworderror"></span>
        </div>
        <div class="d-flexinline">                    
            <input type="checkbox" id="checkbox" name="checkbox" />
            <span class="checkboxtext" id="logincheckboxtex">lorem ipsum is simply dummy text of the printing and typesetting industry. 
                lorem ipsum has been the industry's standard dummy text ever since the 1500s</span>
        </div>
        <button type="submit" name="login" class="btn" id="login-btn">
            <span>sign in</span>
            <span class="spinner" style="display: none;"></span>
        </button>                   

    </form>
    <?php
}
add_shortcode('custom_login', 'custom_login_form');

登录后复制

登录第2步：
创建登录表单句柄函数：

// custom sign in poup form handle
function handle_custom_login() {
    if (isset($_post['login'])) {
        $useremail = sanitize_user($_post['useremail']);
        $password = sanitize_text_field($_post['password']);
        $creds = array(
            'user_login'    => $useremail,
            'user_password' => $password,
            'remember'      => isset($_post['remember']),
        );

        $user = wp_signon($creds, false);

        if (is_wp_error($user)) {
            echo '<script>alert("login failed: ' . $user->get_error_message() . '");</script>';
        } else {
            wp_redirect(home_url());
            exit;
        }
    }
}
add_action('init', 'handle_custom_login');

登录后复制

登录第 3 步：
在弹出模式中添加简码。

自定义注册

注册第1步：
为 cusom 注册表单简码创建函数：

// custom registration form

function custom_registration_form() {

    ?>
    <form method="post" class="formvalidationqueryregister login-form">
        <div class="form-group">
            <label for="">*user name</label>
            <input type="text" id="yourname" name="username" placeholder="username" required />
        </div>
        <div class="form-group">
            <label for="">*user email</label>
            <input type="email" id="youremail" name="email" placeholder="email" required />
        </div>
        <div class="form-group">
        <label for="">*password</label>
            <input type="password" name="password" id="loginpassword" placeholder="password" required />
            <span class="formerror" id="loginpassworderror"></span>
        </div>
        <div class="d-flexinline">                    
            <input type="checkbox" id="checkbox" name="checkbox" />
            <span class="checkboxtext" id="logincheckboxtex">lorem ipsum is simply dummy text of the printing and typesetting industry. 
                lorem ipsum has been the industry's standard dummy text ever since the 1500s</span>
        </div>
        <button type="submit" name="register" class="btn" id="login-btn">
            <span>sign in</span>
            <span class="spinner" style="display: none;"></span>
        </button>                   

    </form>
    <?php
}
add_shortcode('custom_registration', 'custom_registration_form');

登录后复制

注册第2步：
创建处理注册表单请求的函数：

// custom sign up form handle
function handle_custom_signup() {
    if (isset($_POST['register'])) {
        $username = sanitize_user($_POST['username']);
        $email = sanitize_email($_POST['email']);
        $password = sanitize_text_field($_POST['password']);

        // Check if the username and email already exist
        if (username_exists($username)) {
            echo '<script>alert("Username already exists.");</script>';
            return;
        }
        if (email_exists($email)) {
            echo '<script>alert("Email is already registered.");</script>';
            return;
        }

        // Create a new user
        $user_id = wp_create_user($username, $password, $email);

        if (is_wp_error($user_id)) {
            echo '<script>alert("Error: ' . $user_id->get_error_message() . '");</script>';
        } else {
            echo '<script>alert("Registration successful! You can now log in.");</script>';
        }
    }
}
add_action('init', 'handle_custom_signup');

登录后复制

以上就是如何在没有任何插件的情况下创建 WordPress 自定义登录弹出模式的详细内容，