![\"StrictThemes\"](\"https:\/\/strictthemes.com\/articles\/wp-content\/uploads\/2024\/06\/StrictThemes-banner.jpg\")
<\/p>\n
Below is a screenshot of the WordPress Registration form that will be developed at the end of this tutorial.<\/p>\n
![\"Custom](\"https:\/\/strictthemes.com\/articles\/wp-content\/uploads\/2024\/06\/custom-wordpress-registration-form.png\")
<\/p>\n
Coding the Registration Form Plugin<\/h2>\n
The actual registration of a user after completing a form is done using the WordPress wp_insert_user()<\/a> function. It accepts an array of user data (username, password, email and other extra profile fields) and inserts them into the database thus registering the user.<\/p>\n In order not to make the form unnecessarily long, we will use the following profile fields in the registration form.<\/p>\n Let’s get started.<\/p>\n First, create a folder where all of the plugin files will be stored. E.g. Include the plugin file header as follows:<\/p>\n [php] \/* We are using form components from Designmodo’s Flat UI<\/strong> kit to beautify the form, hence it should be installed on the plugin folder.<\/p>\n Download the Flat UI<\/a> kit, extract the files and copy the Create the plugin class and include the properties that will store the various form values.<\/p>\n [php] \/\/ form properties The magic [php] The [php]public function registration_form() ?><\/p>\n <form method="post" action="<?php echo esc_url($_SERVER[‘REQUEST_URI’]); ?>"> <div class="form-group"> <div class="form-group"> <div class="form-group"> <div class="form-group"> <div class="form-group"> <div class="form-group"> <div class="form-group"> <input class="btn btn-primary btn-lg btn-block" type="submit" name="reg_submit" value="Register"\/> The The method returns an error message when an invalid data is entered into the form.<\/p>\n [php] if (empty($this->username) || empty($this->password) || empty($this->email)) { if (strlen($this->username) < 4) { if (strlen($this->password) < 5) { if (!is_email($this->email)) { if (email_exists($this->email)) { if (!empty($website)) { $details = array(‘Username’ => $this->username, foreach ($details as $field => $detail) { } The [php] $userdata = array( if (is_wp_error($this->validation())) { echo ‘<div style="margin-bottom: 6px" class="btn btn-block btn-lg btn-danger">’; } Let me explain how the code in \n
Designmodo-registration-form<\/code><\/p>\n
\n<?php<\/p>\n
\n Plugin Name: Designmodo Registration Form
\n Plugin URI: https:\/\/designmodo.com
\n Description: Simple WordPress registration form plugin that just work
\n Version: 1.0
\n Author: Agbonghama Collins
\n Author URI:
\n *\/
\n[\/php]<\/p>\nbootstrap<\/code>, css<\/code> and font<\/code> folder to the plugin folder.<\/p>\n
\nclass Designmodo_registration_form
\n{<\/p>\n
\n private $username;
\n private $email;
\n private $password;
\n private $website;
\n private $first_name;
\n private $last_name;
\n private $nickname;
\n private $bio;
\n[\/php]<\/p>\n__construct()<\/code> method handles the registration of the shortcode [dm_registration_form]<\/strong> and enqueue the Bootstrap and Flat UI stylesheet powered by the wp_enqueue_scripts<\/code> Action hook.<\/p>\n
\n function __construct()
\n {
\n add_shortcode(‘dm_registration_form’, array($this, ‘shortcode’));
\n add_action(‘wp_enqueue_scripts’, array($this, ‘flat_ui_kit’));
\n }
\n[\/php]<\/p>\nregistration_form<\/code> method below contains the Registration HTML form code which also includes Flat UI<\/strong> form components, CSS IDs and class.<\/p>\n
\n {<\/p>\n
\n <div class="login-form">
\n <div class="form-group">
\n <input name="reg_name" type="text" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_name’]) ? $_POST[‘reg_name’] : null); ?>"
\n placeholder="Username" id="reg-name" required\/>
\n <label class="login-field-icon fui-user" for="reg-name"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_email" type="email" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_email’]) ? $_POST[‘reg_email’] : null); ?>"
\n placeholder="Email" id="reg-email" required\/>
\n <label class="login-field-icon fui-mail" for="reg-email"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_password" type="password" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_password’]) ? $_POST[‘reg_password’] : null); ?>"
\n placeholder="Password" id="reg-pass" required\/>
\n <label class="login-field-icon fui-lock" for="reg-pass"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_website" type="text" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_website’]) ? $_POST[‘reg_website’] : null); ?>"
\n placeholder="Website" id="reg-website"\/>
\n <label class="login-field-icon fui-chat" for="reg-website"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_fname" type="text" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_fname’]) ? $_POST[‘reg_fname’] : null); ?>"
\n placeholder="First Name" id="reg-fname"\/>
\n <label class="login-field-icon fui-user" for="reg-fname"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_lname" type="text" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_lname’]) ? $_POST[‘reg_lname’] : null); ?>"
\n placeholder="Last Name" id="reg-lname"\/>
\n <label class="login-field-icon fui-user" for="reg-lname"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_nickname" type="text" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_nickname’]) ? $_POST[‘reg_nickname’] : null); ?>"
\n placeholder="Nickname" id="reg-nickname"\/>
\n <label class="login-field-icon fui-user" for="reg-nickname"><\/label>
\n <\/div><\/p>\n
\n <input name="reg_bio" type="text" class="form-control login-field"
\n value="<?php echo(isset($_POST[‘reg_bio’]) ? $_POST[‘reg_bio’] : null); ?>"
\n placeholder="About \/ Bio" id="reg-bio"\/>
\n <label class="login-field-icon fui-new" for="reg-bio"><\/label>
\n <\/div><\/p>\n
\n <\/form><closeform><\/closeform>
\n <\/div>
\n <?php
\n }
\n[\/php]<\/p>\nvalidation<\/code> method will validate the registration form data and ensure that:<\/p>\n\n
\nfunction validation()
\n {<\/p>\n
\n return new WP_Error(‘field’, ‘Required form field is missing’);
\n }<\/p>\n
\n return new WP_Error(‘username_length’, ‘Username too short. At least 4 characters is required’);
\n }<\/p>\n
\n return new WP_Error(‘password’, ‘Password length must be greater than 5′);
\n }<\/p>\n
\n return new WP_Error(’email_invalid’, ‘Email is not valid’);
\n }<\/p>\n
\n return new WP_Error(’email’, ‘Email Already in use’);
\n }<\/p>\n
\n if (!filter_var($this->website, FILTER_VALIDATE_URL)) {
\n return new WP_Error(‘website’, ‘Website is not a valid URL’);
\n }
\n }<\/p>\n
\n ‘First Name’ => $this->first_name,
\n ‘Last Name’ => $this->last_name,
\n ‘Nickname’ => $this->nickname,
\n ‘bio’ => $this->bio
\n );<\/p>\n
\n if (!validate_username($detail)) {
\n return new WP_Error(‘name_invalid’, ‘Sorry, the "’ . $field . ‘" you entered is not valid’);
\n }
\n }<\/p>\n
\n[\/php]<\/p>\nregistration<\/code> method handles the registration of the user.
\nBefore the method proceeds in the registration of the user, it ensures no error was generated by the registration form, i.e no invalid data was detected.<\/p>\n
\n function registration()
\n {<\/p>\n
\n ‘user_login’ => esc_attr($this->username),
\n ‘user_email’ => esc_attr($this->email),
\n ‘user_pass’ => esc_attr($this->password),
\n ‘user_url’ => esc_attr($this->website),
\n ‘first_name’ => esc_attr($this->first_name),
\n ‘last_name’ => esc_attr($this->last_name),
\n ‘nickname’ => esc_attr($this->nickname),
\n ‘description’ => esc_attr($this->bio),
\n );<\/p>\n
\n echo ‘<div style="margin-bottom: 6px" class="btn btn-block btn-lg btn-danger">’;
\n echo ‘<strong>’ . $this->validation()->get_error_message() . ‘<\/strong>’;
\n echo ‘<\/div>’;
\n } else {
\n $register_user = wp_insert_user($userdata);
\n if (!is_wp_error($register_user)) {<\/p>\n
\n echo ‘<strong>Registration complete. Goto <a href="’ . wp_login_url() . ‘">login page<\/a><\/strong>’;
\n echo ‘<\/div>’;
\n } else {
\n echo ‘<div style="margin-bottom: 6px" class="btn btn-block btn-lg btn-danger">’;
\n echo ‘<strong>’ . $register_user->get_error_message() . ‘<\/strong>’;
\n echo ‘<\/div>’;
\n }
\n }<\/p>\n
\n[\/php]<\/p>\nregistration<\/code> method handles user registration.<\/p>\n