Создание плагина пользовательской формы регистрации на WordPress

2020-10-20 0 ∞ 5

В базовой комплектации WordPress предоставляет разработчикам форму регистрации, которую можно использовать для настройки данных пользователя или добавления нового пользователя.

Но что, если вы хотите реализовать собственную форму регистрации, которая включает данные, не охваченные опциями консоли WordPress?

В этом уроке мы узнаем, как создать пользовательскую форму регистрацию WordPress, используя комбинацию тэгов шаблонов и шорткоды.

Форма регистрации по умолчанию состоит всего из двух полей - имя пользователя и адрес электронной почты:

При наличии только двух полей для ввода данных: имени пользователя и адреса электронной почты, - зарегистрироваться в системе невероятно легко. Сначала вы вводите имя пользователя и адрес электронной почты, после чего пароль будет вам выслан. Далее вы входите на сайт под своим логином и заполняете профиль, изменяете пароль.

Создание плагина
- Использование плагина
- Заключение

Вместо того чтобы заставлять пользователя проходить через эту процедуру, почему бы сразу не предоставить ему расширенную регистрационную форму, состоящую из некоторых важных дополнительных полей, кроме имени пользователя и электронной почты. Например, пароль, URL-адрес сайта, биография, ник, имя и фамилия.

Это особенно полезно для сайтов, которые ведутся несколькими авторами.

В этой статье мы создадим плагин пользовательской формы регистрации со следующими полями:

имя пользователя;
пароль;
E-mail;
адрес веб-сайта;
имя;
фамилия;
ник;
биография (или раздел обо мне).

Пользовательская форма регистрации может быть интегрирована в WordPress с помощью плагина шорткода и связанного с ним тега шаблона.

С помощью шорткода вы можете создать страницу и сделать ее официальной страницей регистрации вашего сайта. Вы также можете использовать код в записи, чтобы после прочтения одной из ваших статей пользователь мог подписаться на обновления на вашем сайте.

Если вы хотите добавить регистрационную форму в боковой панели или в определенном месте своего сайта, вы можете отредактировать тему WordPress и поместить тег шаблона в нужном месте.

Прежде чем мы начнем создавать плагин формы регистрации, стоит отметить, что имя пользователя, пароль и адрес электронной почты будут обязательными для заполнения полями.

Мы будем соблюдать это правило при написании функции валидации.

Создание плагина

С учетом всего выше сказанного, давайте приступим к составлению кода плагина. Во-первых, включаем заголовок плагина:

<?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
 */

Далее мы создаем функцию PHP, которая содержит HTML-код формы регистрации:

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">Имя пользователя <strong>*</strong></label>
    <input type="text" name="username" value="' . ( isset( $_POST['username'] ) ? $username : null ) . '">
    </div>

    <div>
    <label for="password">Пароль <strong>*</strong></label>
    <input type="password" name="password" value="' . ( isset( $_POST['password'] ) ? $password : null ) . '">
    </div>

    <div>
    <label for="email">E-mail <strong>*</strong></label>
    <input type="text" name="email" value="' . ( isset( $_POST['email']) ? $email : null ) . '">
    </div>

    <div>
    <label for="website">Сайт</label>
    <input type="text" name="website" value="' . ( isset( $_POST['website']) ? $website : null ) . '">
    </div>

    <div>
    <label for="firstname">Имя</label>
    <input type="text" name="fname" value="' . ( isset( $_POST['fname']) ? $first_name : null ) . '">
    </div>

    <div>
    <label for="website">Фамилия</label>
    <input type="text" name="lname" value="' . ( isset( $_POST['lname']) ? $last_name : null ) . '">
    </div>

    <div>
    <label for="nickname">Ник</label>
    <input type="text" name="nickname" value="' . ( isset( $_POST['nickname']) ? $nickname : null ) . '">
    </div>

    <div>
    <label for="bio">Обо мне / Бтография</label>
    <textarea name="bio">' . ( isset( $_POST['bio']) ? $bio : null ) . '</textarea>
    </div>
    <input type="submit" name="submit" value="Register"/>
    </form>
    ';
}

Обратите внимание, что поле регистрации передается в приведенную выше функцию в качестве переменной. В коде функции, вы увидите экземпляры следующего кода, например:

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

Тройной оператор проверяет содержимое глобального массива $_POST, чтобы определить, содержит ли форма значения. Если да, то заполняет поля формы значениями, чтобы пользователю не нужно было повторно вводить данные.

Форма регистрации должна обязательно содержать компоненты для проверки и обеспечения безопасности данных. Поэтому мы создаем функцию валидации с именем registration_validation.

Чтобы упростить валидацию, мы будем использовать класс WordPress WP_Error.

Вот, как мы создаем эту функцию.

Создаем функцию и передаем ей поля регистрация в качестве аргументов:

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

Устанавливаем экземпляр класса WP_Error и делаем экземпляр переменной глобальным, чтобы он мог получать доступ к объектам за пределами функции:

global $reg_errors;
$reg_errors = new WP_Error;

Помните, я подчеркивал, что имя пользователя, пароль и адрес электронной почты являются обязательными полями. Чтобы сделать все правило, мы должны проверить, заполнены ли все эти поля. Если нет, мы добавляем сообщение об ошибке в глобальный класс WP_Error:

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

Мы также проверяем наличие в имени пользователя не менее 4 символов:

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

Проверяем, свободно ли введенное имя пользователя:

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

С помощью функции WordPress validate_username проверяем валидность имени пользователя:

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

Проверяем, состоит ли пароль более чем из 5 символов:

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

Проверяем валидность адреса электронной почты:

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

Проверяем, не был ли уже зарегистрирован данный адрес электронной почты:

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

Если поле адреса сайта заполнено, проверяем его валидность:

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

Наконец пропускаем через цикл ошибки в нашем объекте WP_Error и выводим все обнаруженные ошибки:

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>';

    }

}

Мы закончили с кодом функции валидации.

Следующая функция нашего плагина complete_registration(), она обрабатывает регистрацию пользователя.

Регистрация пользователя фактически осуществляется с помощью функции wp_insert_user, она принимает массив данных пользователя:

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 'Регистрация завершена. Перейдите на <a href="' . get_site_url() . '/wp-login.php">login page</a>.';   
    }
}

В приведенной выше функции complete_registration() мы сделали экземпляр объекта $reg_errors - WP_Error и переменные полей формы глобальными, чтобы мы могли обращаться к переменным глобально.

Затем мы проверяем, содержит ли экземпляр объекта обработки ошибок $reg_errors ошибки. Если ошибок не обнаружено, мы переходим к заполнению массива $userdata и добавляем регистрационные данные пользователя в базу данных WordPress, а также выводим сообщение "Регистрация завершена" со ссылкой на страницу входа.

Далее у нас идет супер функция custom_registration_function(), которая приводит все созданные нами ранее функции в действие:

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']
        );

        // проверка безопасности введенных данных
        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'] );

        // вызов @function complete_registration, чтобы создать пользователя
        // только если не обнаружено WP_error
        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 для вывода форму регистрации.

Помните, я упомянул, что мы обеспечим поддержку шорткода для регистрации плагина? Ниже приведен код поддержки шорткода:

// Регистрируем новый шорткод: [cr_custom_registration]
add_shortcode( 'cr_custom_registration', 'custom_registration_shortcode' );

// Обратный вызов функции, которая заменит [book]
function custom_registration_shortcode() {
    ob_start();
    custom_registration_function();
    return ob_get_clean();
}

Мы закончили с кодом плагина. Ниже приведено изображение, показывающее, как должна выглядеть форма регистрации.

Обратите внимание, что форма на вашем сайте может отличаться от этого изображения, для этого вам нужно будет применить другие стили:

Использование плагина

Для реализации плагина в записи или на странице WordPress используйте шорткод [cr_custom_registration].
Для реализации формы регистрации в определенном месте вашей темы, добавьте следующий тег шаблона - <?php custom_registration_function(); ?> .

Файл плагина вы можете скачать здесь.

Заключение

В этой статье, мы рассмотрели процесс создания плагина, который добавляет пользовательскую форму регистрации WordPress. В дальнейшем вы можете расширить ее, включить дополнительные поля, такие как роль пользователя, учетная запись AOL IM, но убедитесь, что данные полей формы являются валидными для мета wp_insert_user.

Если у вас есть вопросы и предложения, дайте мне знать в комментариях!