How to Create Custom Login and Register Pages in WordPress

How to Set Up Custom Login, Logout, Lost Password, and Register Pages in WordPress (Child Theme), follow these steps:

Login Form Reference
https://developer.wordpress.org/reference/functions/wp_login_form/
Link to the official WordPress documentation for wp_login_form(), explaining its usage and customization.

User Registration API
https://developer.wordpress.org/reference/functions/wp_insert_user/
Guides users on how to register new users programmatically using wp_insert_user().

Lost Password Functionality
https://wordpress.org/support/article/resetting-your-password/
Official WordPress support guide for resetting passwords.

wp_logout() Function
https://developer.wordpress.org/reference/functions/wp_logout/
Explains how the wp_logout() function works and how to redirect users upon logout.

/your-child-theme/
│
├── functions.php
├── custom_templates/
│   ├── custom-login.php
│   ├── custom-register.php
│   ├── custom-lost-password.php
│   └── custom-logout.php

Step 1: Create Custom Page Templates

You need to create custom templates for each authentication-related page.

1.1. Create custom PHP File for Login

Inside your child theme, create a file named custom-login.php and add this code:

<?php
/**
 * Template Name: Custom Login
 */

get_header(); 

if ( is_user_logged_in() ) {
    wp_redirect( home_url() );
    exit;
}
?>
<div class="custom-login-form">
    <?php wp_login_form(); ?>
</div>
<?php get_footer(); ?>

1.2. Create custom PHP File for Registration

Create a file named custom-register.php and add:

<?php
/**
 * Template Name: Custom Register
 */

get_header(); 

if ( is_user_logged_in() ) {
    wp_redirect( home_url() );
    exit;
}

if ( isset($_POST['register']) ) {
    $userdata = array(
        'user_login' => $_POST['username'],
        'user_email' => $_POST['email'],
        'user_pass'  => $_POST['password']
    );

    $user_id = wp_insert_user( $userdata );

    if ( !is_wp_error($user_id) ) {
        echo "<p>Registration successful. <a href='".home_url('/login')."'>Login here</a></p>";
    } else {
        echo "<p>Error: ".$user_id->get_error_message()."</p>";
    }
}
?>

<form method="post">
    <input type="text" name="username" placeholder="Username" required>
    <input type="email" name="email" placeholder="Email" required>
    <input type="password" name="password" placeholder="Password" required>
    <button type="submit" name="register">Register</button>
</form>

<?php get_footer(); ?>

1.3. Create New PHP File for Lost Password

Create a file named custom-lost-password.php and add:

<?php
/**
 * Template Name: Lost Password
 */

get_header(); 

if ( isset($_POST['user_login']) ) {
    $user_login = $_POST['user_login'];
    $user = get_user_by('email', $user_login) ?: get_user_by('login', $user_login);
    
    if ($user) {
        $reset_link = wp_lostpassword_url();
        echo "<p>Password reset link sent. Check your email.</p>";
    } else {
        echo "<p>User not found.</p>";
    }
}
?>

<form method="post">
    <input type="text" name="user_login" placeholder="Username or Email" required>
    <button type="submit">Reset Password</button>
</form>

<?php get_footer(); ?>

1.4. Create New PHP File for Logout

Create a file named custom-logout.php and add:

<?php
/**
 * Template Name: Custom Logout
 */

wp_logout();
wp_redirect( home_url() );
exit;
?>

Step 2: Create custom Pages in WordPress

1. Go to Pages → Add New
2. Create new pages and assign the templates:
   • Login → Assign Custom Login
   • Register → Assign Custom Register
   • Lost Password → Assign Lost Password
   • Logout → Assign Custom Logout
3. Publish each page.

Step 3: Redirect Default Login Pages

To redirect users to your custom pages, add this to your child theme’s functions.php:

function custom_login_redirect() {
    if (strpos($_SERVER['REQUEST_URI'], 'wp-login.php') !== false && !is_admin()) {
        wp_redirect(home_url('/login'));
        exit;
    }
}
add_action('init', 'custom_login_redirect');

Step 4: Style the Forms

Add custom styles in your child theme’s style.css:

.custom-login-form form,
form {
    max-width: 400px;
    margin: auto;
    padding: 20px;
    background: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 5px;
}

form input {
    width: 100%;
    padding: 10px;
    margin: 5px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
}

form button {
    width: 100%;
    background: #0073aa;
    color: #fff;
    padding: 10px;
    border: none;
    cursor: pointer;
}

form button:hover {
    background: #005a87;
}

Step 5: Test Everything

• Visit /login, /register, /lost-password, and /logout to confirm the custom pages work correctly.

Now you have fully customized authentication pages within your WordPress child theme! 🚀

Tags

#WordPress #ChildTheme #CustomLogin #UserAuthentication #PHP #WordPressSecurity #CustomPages #UserManagement #LoginRedirect #WebDevelopment