Как добавить дополнительное поле в форму входа WordPress с подтверждением

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

Почему может понадобиться дополнительное поле в форме входа WordPress

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

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

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

Как добавить дополнительное поле в форму входа WordPress

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

add_action('login_form', 'wpfaq_add_custom_login_field');
function wpfaq_add_custom_login_field() {
    ?>
    <p>
        <label for="wpfaq_confirmation_code">Код подтверждения<br>
        <input type="text" name="wpfaq_confirmation_code" id="wpfaq_confirmation_code" class="input" value="" size="20" /></label>
    </p>
    <?php
}

Этот код добавляет новое текстовое поле в форму входа под стандартными полями.

Проверка и валидация дополнительного поля при отправке формы

После того, как пользователь ввел данные, необходимо проверить поле на сервере. Для этого используем фильтр authenticate. В нем мы можем получить все поля, включая наш wpfaq_confirmation_code, и проверить их. Если проверка не пройдет — вернем ошибку.

add_filter('authenticate', 'wpfaq_check_custom_login_field', 30, 3);
function wpfaq_check_custom_login_field($user, $username, $password) {
    if (isset($_POST['wpfaq_confirmation_code'])) {
        $code = sanitize_text_field($_POST['wpfaq_confirmation_code']);
        if ($code !== '123456') { // пример проверки
            return new WP_Error('authentication_failed', __('<strong>Ошибка:</strong> Неверный код подтверждения.'));
        }
    } else {
        return new WP_Error('authentication_failed', __('<strong>Ошибка:</strong> Код подтверждения обязателен.'));
    }
    return $user;
}

В этом примере код подтверждения должен быть равен строке 123456. В реальном проекте вы можете заменить это на проверку из базы данных, API или сессии.

Обработка дополнительного поля после успешного входа

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

add_action('wp_login', 'wpfaq_after_successful_login', 10, 2);
function wpfaq_after_successful_login($user_login, $user) {
    if (isset($_POST['wpfaq_confirmation_code'])) {
        $code = sanitize_text_field($_POST['wpfaq_confirmation_code']);
        // Сохраняем в мета пользователя или логируем
        update_user_meta($user->ID, 'confirmation_code', $code);
    }
}

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

Дополнительные советы и улучшения

Стилизация дополнительного поля

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

add_action('login_enqueue_scripts', 'wpfaq_custom_login_styles');
function wpfaq_custom_login_styles() {
    ?>
    <style>
        #wpfaq_confirmation_code {
            border: 1px solid #ccc;
            padding: 5px;
            width: 100%;
            box-sizing: border-box;
        }
    </style>
    <?php
}

Использование плагинов для расширенной аутентификации

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

Безопасность и защита данных

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

Итоги

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

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