Creating a custom registration form in WordPress without using a plugin involves a few steps. This includes creating the form, handling form submission, and storing user data in the WordPress database. Here’s a step-by-step guide:
Step 1: Create a Registration Form
You can create a simple form using HTML and include it in your theme file (e.g., page-register.php) or use a shortcode.
HTML Form Code:
<?php
function custom_registration_form() {
ob_start(); ?>
<form method="post" action="">
<p>
<label for="username">Username</label>
<input type="text" name="username" id="username" required>
</p>
<p>
<label for="email">Email</label>
<input type="email" name="email" id="email" required>
</p>
<p>
<label for="password">Password</label>
<input type="password" name="password" id="password" required>
</p>
<p>
<input type="submit" name="submit" value="Register">
</p>
</form>
<?php
return ob_get_clean();
}
add_shortcode('custom_registration_form', 'custom_registration_form');
You can now use the [custom_registration_form] shortcode to display the form on any page or post.
Step 2: Handle Form Submission
Process the form submission, validate inputs, and register the user in WordPress.
Code:
function custom_registration_form_handler() {
if (isset($_POST['submit'])) {
$username = sanitize_user($_POST['username']);
$email = sanitize_email($_POST['email']);
$password = sanitize_text_field($_POST['password']);
// Check if username or email already exists
if (username_exists($username)) {
echo '<p style="color: red;">Username already exists!</p>';
return;
}
if (email_exists($email)) {
echo '<p style="color: red;">Email already exists!</p>';
return;
}
// Register the user
$user_id = wp_create_user($username, $password, $email);
if (is_wp_error($user_id)) {
echo '<p style="color: red;">An error occurred: ' . $user_id->get_error_message() . '</p>';
} else {
echo '<p style="color: green;">Registration successful! You can now log in.</p>';
}
}
}
add_action('init', 'custom_registration_form_handler');
Step 3: Redirect After Registration (Optional)
If you want to redirect the user after successful registration, modify the handler:
Code:
if (!is_wp_error($user_id)) {
wp_redirect(home_url('/login')); // Replace '/login' with your login page URL
exit;
}
Step 4: Add Styles (Optional)
Add custom CSS to style your form.
CSS:
form {
max-width: 400px;
margin: 0 auto;
}
form p {
margin-bottom: 15px;
}
form label {
display: block;
font-weight: bold;
margin-bottom: 5px;
}
form input {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
}
form input[type="submit"] {
background-color: #0073aa;
color: #fff;
border: none;
cursor: pointer;
}
form input[type="submit"]:hover {
background-color: #005177;
}
Step 5: Display the Form
- Use the
[custom_registration_form]shortcode on any page. - Alternatively, include the form directly in a PHP file:
echo do_shortcode('[custom_registration_form]');
Step 6: Test the Form
[custom_registration_form] shortcode.Visit the page and try registering a new user.Verify the user is added in the WordPress admin under Users.Security: Ensure that the form is secure by adding nonce fields and escaping outputs.
wp_nonce_field('custom_registration_form_action', 'custom_registration_form_nonce');
Then validate it in the form handler:
if (!isset($_POST['custom_registration_form_nonce']) ||
!wp_verify_nonce($_POST['custom_registration_form_nonce'], 'custom_registration_form_action')) {
echo '<p style="color: red;">Security check failed!</p>';
return;
}
Custom Fields: If you want to add custom fields (e.g., phone number), include them in the form and save them as user meta:
update_user_meta($user_id, 'phone', sanitize_text_field($_POST['phone']));
This approach creates a lightweight and customizable registration form for WordPress. Let me know if you need further enhancements!