Стандартная форма регистрации WordPress часто не устраивает владельцев сайтов, так как она базовая и не позволяет собрать нужные данные или оформить процесс регистрации в стиле сайта. В этой статье мы разберём, как создать собственный вид регистрации пользователей в WordPress с помощью плагинов, а также как добавить кастомные поля и обработать их с помощью кода.
Почему стоит создавать собственную форму регистрации в WordPress
По умолчанию WordPress предлагает простую форму регистрации, которая содержит всего несколько полей: имя пользователя, email и пароль. Для многих проектов этого недостаточно. Например, если вы хотите:
- Собрать дополнительные данные о пользователях (телефон, адрес, дата рождения и т.д.)
- Добавить проверку данных или капчу для защиты от спама
- Оформить форму в стиле вашего сайта
- Настроить автоматическую отправку писем, редиректы и другие действия после регистрации
Создание кастомной формы регистрации решает эти задачи и улучшает опыт пользователя.
Обзор популярных плагинов для кастомной регистрации
Существует несколько мощных плагинов, которые позволяют создавать собственные формы регистрации без написания кода. Рассмотрим самые востребованные:
1. WP User Manager
Плагин позволяет создавать красивые формы регистрации, логина и профиля. Есть гибкая настройка полей, управление ролями и интеграция с почтовыми уведомлениями.
2. User Registration – Custom Registration Form, Login and User Profile for WordPress
Очень простой и удобный плагин для создания форм регистрации с drag&drop конструктором полей. Поддерживает валидацию и различные типы полей.
3. Profile Builder
Предлагает расширенные возможности по настройке форм, включая создание нескольких форм для разных ролей пользователей, добавление пользовательских полей и управление редиректами.
Как создать собственную форму регистрации с User Registration
Рассмотрим на примере плагина User Registration создание формы с дополнительными полями.
- Устанавливаем и активируем плагин через панель WordPress.
- В меню "User Registration" выбираем "Add New" для создания новой формы.
- С помощью конструктора добавляем поля, например,
Телефон,Дата рождения,Согласие с условиями. - Настраиваем обязательность полей и типы (текст, дата, чекбокс).
- Сохраняем форму и копируем шорткод.
- Вставляем шорткод в нужную страницу для отображения формы.
Таким образом вы получаете форму, которая при регистрации добавляет дополнительные данные в пользовательский профиль.
Расширение функционала: добавление полей в базу данных и обработка через код
Для более тонкой настройки мы можем добавить обработчики через код. Например, сохраним поле "Телефон" в метаданные пользователя и выведем его в админке.
function wplessons_save_custom_user_phone($user_id) {
if (isset($_POST['phone'])) {
update_user_meta($user_id, 'phone', sanitize_text_field($_POST['phone']));
}
}
add_action('user_register', 'wplessons_save_custom_user_phone');
function wplessons_show_custom_user_phone($user) {
?>
<h3>Дополнительная информация</h3>
<table class="form-table">
<tr>
<th><label for="phone">Телефон</label></th>
<td>
<input type="text" name="phone" id="phone" value="<?php echo esc_attr(get_user_meta($user->ID, 'phone', true)); ?>" class="regular-text" /><br />
<span class="description">Введите телефон пользователя.</span>
</td>
</tr>
</table>
<?php
}
add_action('show_user_profile', 'wplessons_show_custom_user_phone');
add_action('edit_user_profile', 'wplessons_show_custom_user_phone');
function wplessons_save_custom_user_phone_profile($user_id) {
if (!current_user_can('edit_user', $user_id)) {
return false;
}
update_user_meta($user_id, 'phone', sanitize_text_field($_POST['phone']));
}
add_action('personal_options_update', 'wplessons_save_custom_user_phone_profile');
add_action('edit_user_profile_update', 'wplessons_save_custom_user_phone_profile');В этом коде мы:
- Сохраняем значение поля "phone" при регистрации пользователя.
- Добавляем поле для редактирования телефона в профиль пользователя в админке.
- Обрабатываем сохранение изменений из админки.
Как добавить защиту от спама в кастомную форму регистрации
Частая проблема при создании кастомных форм – спам-боты. Чтобы защитить форму, можно использовать несколько методов.
1. Интеграция Google reCAPTCHA
Большинство плагинов, например, User Registration, поддерживают добавление reCAPTCHA в форму. Нужно зарегистрировать сайт на https://www.google.com/recaptcha, получить ключи и вставить их в настройки плагина.
2. Использование honeypot полей
Это метод, при котором в форму добавляется скрытое поле, которое видят только боты. Если это поле заполнено, то отправка формы блокируется.
Пример кода для добавления honeypot поля и проверки:
function wplessons_add_honeypot_field() {
echo '<input type="text" name="wplessons_hp" value="" style="display:none;" autocomplete="off"/>';
}
add_action('register_form', 'wplessons_add_honeypot_field');
function wplessons_check_honeypot_field($errors, $sanitized_user_login, $user_email) {
if (!empty($_POST['wplessons_hp'])) {
$errors->add('wplessons_hp_error', __('Ошибка регистрации.')); // блокируем регистрацию
}
return $errors;
}
add_filter('registration_errors', 'wplessons_check_honeypot_field', 10, 3);3. Ограничение частоты регистрации
Можно использовать плагины для защиты, например, Limit Attempts или аналогичные, чтобы ограничить количество регистраций с одного IP.
Советы по оформлению и UX для формы регистрации
Хорошая форма регистрации должна быть простой и понятной. Вот несколько рекомендаций:
- Минимизируйте количество обязательных полей, чтобы не отпугнуть пользователя.
- Используйте понятные метки и подсказки для полей.
- Добавьте подтверждение пароля и возможность показать скрытый пароль.
- Обеспечьте информирование пользователя об ошибках сразу после ввода.
- Обязательно добавьте ссылку на политику конфиденциальности и условия использования.
Используя плагины и дописывая кастомные функции, вы сможете сделать процесс регистрации удобным и безопасным, что положительно скажется на конверсии и качестве базы пользователей.