Как добавить дополнительное поле в форму регистрации WordPress с помощью кода

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

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

Конечно, в репозитории WordPress есть множество плагинов для расширения регистрации, например, Profile Builder, User Registration и другие. Однако если нужна гибкость, контроль над кодом и минимальное влияние на производительность сайта, лучше реализовать это самостоятельно. Кроме того, так вы сможете интегрировать кастомные поля с вашей бизнес-логикой и избежать лишних обновлений и конфликтов.

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

Добавление поля в форму регистрации WordPress (hook register_form)

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

function wpcourse_add_custom_register_field() {
    $phone = ( isset( $_POST['wpcourse_phone'] ) ) ? sanitize_text_field( $_POST['wpcourse_phone'] ) : '';
    ?>
    <p>
        <label for="wpcourse_phone">Телефон<br />
            <input type="text" name="wpcourse_phone" id="wpcourse_phone" class="input" value="<?php echo esc_attr( $phone ); ?>" size="25" /></label>
    </p>
    <?php
}
add_action( 'register_form', 'wpcourse_add_custom_register_field' );

Этот код добавит в форму регистрации текстовое поле с меткой «Телефон». Значение поля сохраняется при ошибках, чтобы пользователь не вводил заново.

Валидация пользовательского поля (hook registration_errors)

Следующий важный шаг — проверить введенное значение. Для этого используем фильтр registration_errors. Здесь можно проверить, что телефон введен и соответствует формату.

function wpcourse_validate_custom_register_field( $errors, $sanitized_user_login, $user_email ) {
    if ( empty( $_POST['wpcourse_phone'] ) || ! preg_match( '/^\+?\d{10,15}$/', $_POST['wpcourse_phone'] ) ) {
        $errors->add( 'wpcourse_phone_error', '<strong>Ошибка</strong>: Пожалуйста, введите корректный телефонный номер.' );
    }
    return $errors;
}
add_filter( 'registration_errors', 'wpcourse_validate_custom_register_field', 10, 3 );

Здесь мы проверяем, что поле не пустое и содержит от 10 до 15 цифр, с необязательным плюсом в начале (международный формат).

Сохранение дополнительного поля при регистрации (hook user_register)

После успешной регистрации нужно сохранить дополнительное поле в метаданные пользователя.

function wpcourse_save_custom_register_field( $user_id ) {
    if ( ! empty( $_POST['wpcourse_phone'] ) ) {
        update_user_meta( $user_id, 'wpcourse_phone', sanitize_text_field( $_POST['wpcourse_phone'] ) );
    }
}
add_action( 'user_register', 'wpcourse_save_custom_register_field' );

Этот код обновит или добавит мета-ключ wpcourse_phone с номером телефона пользователя.

Отображение дополнительного поля в профиле пользователя (hooks show_user_profile и edit_user_profile)

Чтобы администратор или сам пользователь могли видеть и изменять поле, добавим его в экран профиля.

function wpcourse_show_custom_user_profile( $user ) {
    $phone = get_user_meta( $user->ID, 'wpcourse_phone', true );
    ?>
    <h2>Дополнительная информация</h2>
    <table class="form-table">
        <tr>
            <th><label for="wpcourse_phone">Телефон</label></th>
            <td>
                <input type="text" name="wpcourse_phone" id="wpcourse_phone" value="<?php echo esc_attr( $phone ); ?>" class="regular-text" /><br />
                <span class="description">Пожалуйста, введите ваш телефонный номер.</span>
            </td>
        </tr>
    </table>
    <?php
}
add_action( 'show_user_profile', 'wpcourse_show_custom_user_profile' );
add_action( 'edit_user_profile', 'wpcourse_show_custom_user_profile' );

Сохранение изменений в профиле (hook personal_options_update и edit_user_profile_update)

И не забудем сохранить изменения при обновлении профиля.

function wpcourse_save_custom_user_profile( $user_id ) {
    if ( ! current_user_can( 'edit_user', $user_id ) ) {
        return false;
    }
    if ( isset( $_POST['wpcourse_phone'] ) ) {
        update_user_meta( $user_id, 'wpcourse_phone', sanitize_text_field( $_POST['wpcourse_phone'] ) );
    }
}
add_action( 'personal_options_update', 'wpcourse_save_custom_user_profile' );
add_action( 'edit_user_profile_update', 'wpcourse_save_custom_user_profile' );

Итоги и полезные советы

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

Если вы хотите расширить функционал, можно добавить маски ввода для телефона с помощью JavaScript, интеграцию с CRM или отправку данных в email-уведомления.

Для удобства и безопасности всегда фильтруйте и валидируйте данные, а также учитывайте UX — например, показывайте подсказки и сохраняйте введенное при ошибках.

Если вы используете тему Reboot или другие темы от WPSHOP, этот код легко интегрируется в functions.php дочерней темы или в собственный плагин.

Успешного кодинга!