Create a custom WordPress plug-in registration form

Which means out of the box, WordPress provides a custom registration form, can be used to create a new user, or add a new user to an existing WordPress site. However, if you want to implement a custom registration forms, WordPress options are not displayed in the control panel?

In this tutorial, we will learn how to create custom registration forms WordPress template tags and using a combination of simple code.

The default registration form contains only two form fields - user name and e-mail:

Only the presence of a user name and e-mail form fields, making the registration process is very easy. First, after you enter your user name and e-mail, password will be sent to you. Next, you use the site generated password, then fill in your profile and change passwords more memorable.

Instead of letting users simply register through the above process on your site, why not provide a registration form straight into the subject, including important information other than the number of user names and mail, such as passwords, their URLs, profiles, nicknames and names, and so on.

This is useful for doing such authors as Tuts + sites.

In this article, we will create a custom plug-in registration form, with the following form fields:

username
password
e-mail
Site
first name
Last Name
nickname
Brief introduction

This custom registration form can be integrated into the WordPress website template tags or shortcodes. With this simple code, you can create a page and then set it as the official registration page of your site. Or you can also use this simple code in the article after reading the article allows users to register your site. If you want to add a registration form to the sidebar or anywhere else your site, you can edit the theme file, and then add the template tag to the desired location.

We started to build in the registration form plugin, it is worth noting that, user name, password and email fields are required. We will write to verification in accordance with this rule.

Build a plug

As mentioned above, let us start the code plug. First, it includes the plug head.

<?php
/*
  Plugin Name: Custom Registration
  Plugin URI: http://code.tutsplus.com
  Description: Updates user rating based on number of posts.
  Version: 1.0
  Author: Agbonghama Collins
  Author URI: http://tech4sky.com
 */

　　Next, we create a PHP function HTML code contains the registration form.

function registration_form( $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio ) {
    echo '
    <style>
    div {
        margin-bottom:2px;
    }
 
    input{
        margin-bottom:4px;
    }
    </style>
    ';
 
    echo '
    <form action="' . $_SERVER['REQUEST_URI'] . '" method="post">
    <div>
    <label for="username">Username <strong>*</strong></label>
    <input type="text" name="username" value="' . ( isset( $_POST['username'] ) ? $username : null ) . '">
    </div>
 
    <div>
    <label for="password">Password <strong>*</strong></label>
    <input type="password" name="password" value="' . ( isset( $_POST['password'] ) ? $password : null ) . '">
    </div>
 
    <div>
    <label for="email">Email <strong>*</strong></label>
    <input type="text" name="email" value="' . ( isset( $_POST['email']) ? $email : null ) . '">
    </div>
 
    <div>
    <label for="website">Website</label>
    <input type="text" name="website" value="' . ( isset( $_POST['website']) ? $website : null ) . '">
    </div>
 
    <div>
    <label for="firstname">First Name</label>
    <input type="text" name="fname" value="' . ( isset( $_POST['fname']) ? $first_name : null ) . '">
    </div>
 
    <div>
    <label for="website">Last Name</label>
    <input type="text" name="lname" value="' . ( isset( $_POST['lname']) ? $last_name : null ) . '">
    </div>
 
    <div>
    <label for="nickname">Nickname</label>
    <input type="text" name="nickname" value="' . ( isset( $_POST['nickname']) ? $nickname : null ) . '">
    </div>
 
    <div>
    <label for="bio">About / Bio</label>
    <textarea name="bio">' . ( isset( $_POST['bio']) ? $bio : null ) . '</textarea>
    </div>
    <input type="submit" name="submit" value="Register"/>
    </form>
    ';
}

　　It noted the registration field is passed to the above function as a variable? In the function code, you'll see the code example below, for example:

( isset( $_POST['lname'] ) ? $last_name : null )

The ternary operator checks the contents of the $ _POST global array contains a value of, if included, would impart the form field values, so that a user can save time to re-enter the field.

A registration form is not yet complete until you verify the contents and disinfection user input. Therefore, we will create a validation function named registration_validation of.

To ease the burden, we directly use the WordPress WP_Error class, following up written verification:

1. Create the function, registration field as a function parameter.

function registration_validation( $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio )  {

2. Examples of WP_Error class, set the global variable instance, to ensure that it can be accessed outside the scope function.

global $reg_errors;
$reg_errors = new WP_Error;

3. Remember: We just said user name, password and email are required and can not be left empty. To implement this rule, we need to check whether these fields are empty. If it is, we append the error message to the global WP_Error class.

if ( empty( $username ) || empty( $password ) || empty( $email ) ) {
    $reg_errors->add('field', 'Required form field is missing');
}

4. We also check and confirm the user name of at least 4 digits

1
2
3

if ( 4 > strlen( $username ) ) {
    $reg_errors->add( 'username_length', 'Username too short. At least 4 characters is required' );
}

5. Check whether the user name has been registered

1 2	if ( username_exists( $username ) ) $reg_errors->add('user_name', 'Sorry, that username already exists!');

6. Use the WordPress validate_username function to verify the user name is valid

1
2
3

if ( ! validate_username( $username ) ) {
    $reg_errors->add( 'username_invalid', 'Sorry, the username you entered is not valid' );
}

7. Make sure that the user enters the password digits less than five characters

1
2
3

if ( 5 > strlen( $password ) ) {
        $reg_errors->add( 'password', 'Password length must be greater than 5' );
    }

8. Check the mailbox is valid

1
2
3

if ( !is_email( $email ) ) {
    $reg_errors->add( 'email_invalid', 'Email is not valid' );
}

9. Check the mailbox registered

1
2
3

if ( email_exists( $email ) ) {
    $reg_errors->add( 'email', 'Email Already in use' );
}

10. If the URL field already filled, check for valid

if ( ! empty( $website ) ) {
    if ( ! filter_var( $website, FILTER_VALIDATE_URL ) ) {
        $reg_errors->add( 'website', 'Website is not a valid URL' );
    }
}

11. Finally, we loop error message WP_Error instance, and each display

if ( is_wp_error( $reg_errors ) ) {
 
    foreach ( $reg_errors->get_error_messages() as $error ) {
 
        echo '<div>';
        echo '<strong>ERROR</strong>:';
        echo $error . '<br/>';
        echo '</div>';
 
    }
 
}

Here, we have completed the validation function.

Next, create complete_registration () function to handle user registration.

User registration is actually done by the wp_insert_user function that can accept user data arrays.

function complete_registration() {
    global $reg_errors, $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio;
    if ( 1 > count( $reg_errors->get_error_messages() ) ) {
        $userdata = array(
        'user_login'    =>   $username,
        'user_email'    =>   $email,
        'user_pass'     =>   $password,
        'user_url'      =>   $website,
        'first_name'    =>   $first_name,
        'last_name'     =>   $last_name,
        'nickname'      =>   $nickname,
        'description'   =>   $bio,
        );
        $user = wp_insert_user( $userdata );
        echo 'Registration complete. Goto <a href="' . get_site_url() . '/wp-login.php">login page</a>.';   
    }
}

In the above complete_registration () function, and we will $ reg_errors WP_Error example, the form field, and set a global variable, so that we can access the global scope.

Then we check $ reg_errors error handling example contains an error. If there is no error, we will fill the $ userdata array and write user registration information WordPress database and display the complete registration information and the link to the registration page address.

Back on the floor, custom_registration_function () function is the function that we created above put into use.

function custom_registration_function() {
    if ( isset($_POST['submit'] ) ) {
        registration_validation(
        $_POST['username'],
        $_POST['password'],
        $_POST['email'],
        $_POST['website'],
        $_POST['fname'],
        $_POST['lname'],
        $_POST['nickname'],
        $_POST['bio']
        );
 
        // sanitize user form input
        global $username, $password, $email, $website, $first_name, $last_name, $nickname, $bio;
        $username   =   sanitize_user( $_POST['username'] );
        $password   =   esc_attr( $_POST['password'] );
        $email      =   sanitize_email( $_POST['email'] );
        $website    =   esc_url( $_POST['website'] );
        $first_name =   sanitize_text_field( $_POST['fname'] );
        $last_name  =   sanitize_text_field( $_POST['lname'] );
        $nickname   =   sanitize_text_field( $_POST['nickname'] );
        $bio        =   esc_textarea( $_POST['bio'] );
 
        // call @function complete_registration to create the user
        // only when no WP_error is found
        complete_registration(
        $username,
        $password,
        $email,
        $website,
        $first_name,
        $last_name,
        $nickname,
        $bio
        );
    }
 
    registration_form(
        $username,
        $password,
        $email,
        $website,
        $first_name,
        $last_name,
        $nickname,
        $bio
        );
}

让我解释一下 custom_registration_function() 函数的代码。

首先，我们通过检查 $_POST['submit'] 是否设置来判断表单是否已提交。如果已提交，就调用 registration_validation 函数验证用户提交的数据。然后我们消毒表单数据，并为消毒好的数据设置变量名。最后调用 complete_registration 注册用户。

我们需要调用 registration_form 函数显示注册表单。

记得我提到过要为该插件提供简码支持，下面就是构建简码的代码。

// Register a new shortcode: [cr_custom_registration]
add_shortcode( 'cr_custom_registration', 'custom_registration_shortcode' );
 
// The callback function that will replace [book]
function custom_registration_shortcode() {
    ob_start();
    custom_registration_function();
    return ob_get_clean();
}

到这里，我们就完成了整个插件的代码啦！下面就是最终的效果，当然了，还需要你自己添加 css 样式才能达到下面的显示效果。

插件用法

要在 WordPress 文章或页面中显示这个注册表单，可以使用下面的简码

1	[cr_custom_registration]

要在你主题的特定位置显示注册表单，你可以添加下面的模板标签进行调用

1	<?php custom_registration_function(); ?>

你可以在这里下载本文制作好的插件：Custom Registration Form Plugin