wp-code.ru wordpress WP-Codе

Как добавить поле телефона в регистрацию WordPress с подтверждением через SMS

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

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

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

function wpcode_add_phone_field() {
    $phone = ( ! empty( $_POST['wpcode_phone'] ) ) ? sanitize_text_field( $_POST['wpcode_phone'] ) : '';
    ?>
    <p>
        <label for="wpcode_phone">Телефон (обязательно)<br />
            <input type="text" name="wpcode_phone" id="wpcode_phone" class="input" value="<?php echo esc_attr( $phone ); ?>" size="25" /></label>
    </p>
    <?php
}
add_action( 'register_form', 'wpcode_add_phone_field' );

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

Валидация и сохранение поля телефона

Для валидации используем хук registration_errors, который позволяет проверить данные перед созданием пользователя.

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

Регулярное выражение проверяет, что номер состоит из 10-15 цифр, возможно с плюсом в начале. Вы можете адаптировать его под формат своей страны.

Для сохранения номера используем хук user_register. Здесь же можно инициировать отправку SMS с кодом подтверждения.

function wpcode_save_phone_field( $user_id ) {
    if ( ! empty( $_POST['wpcode_phone'] ) ) {
        update_user_meta( $user_id, 'wpcode_phone', sanitize_text_field( $_POST['wpcode_phone'] ) );
        // Здесь можно инициировать отправку SMS с кодом подтверждения
        wpcode_send_sms_confirmation( $user_id );
    }
}
add_action( 'user_register', 'wpcode_save_phone_field' );

Реализация отправки SMS с кодом подтверждения

Для отправки SMS понадобится сторонний сервис. В примере используем SMS.ru, у которого есть удобное API.

Создадим функцию wpcode_send_sms_confirmation, которая генерирует код, сохраняет его в мета пользователя и отправляет SMS.

function wpcode_send_sms_confirmation( $user_id ) {
    $phone = get_user_meta( $user_id, 'wpcode_phone', true );
    if ( ! $phone ) return;

    $code = wpcode_generate_confirmation_code();
    update_user_meta( $user_id, 'wpcode_phone_confirmation_code', $code );
    update_user_meta( $user_id, 'wpcode_phone_confirmed', 0 );

    $message = "Ваш код подтверждения телефона: $code";

    $api_key = 'ВАШ_API_КЛЮЧ_SMSRU';
    $url = 'https://sms.ru/sms/send?api_id=' . $api_key . '&to=' . urlencode($phone) . '&msg=' . urlencode($message) . '&json=1';

    $response = wp_remote_get( $url );
    // Здесь можно добавить обработку ошибок
}

function wpcode_generate_confirmation_code() {
    return rand(100000, 999999);
}

Не забудьте заменить ВАШ_API_КЛЮЧ_SMSRU на реальный API-ключ из личного кабинета SMS.ru.

Создание страницы для ввода кода подтверждения

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

Пример простого шорткода, который выводит форму и проверяет код:

function wpcode_phone_confirmation_form() {
    if ( ! is_user_logged_in() ) {
        return '<p>Пожалуйста, войдите на сайт для подтверждения телефона.</p>';
    }

    $user_id = get_current_user_id();
    $phone_confirmed = get_user_meta( $user_id, 'wpcode_phone_confirmed', true );
    if ( $phone_confirmed ) {
        return '<p>Ваш телефон уже подтвержден.</p>';
    }

    $message = '';

    if ( isset( $_POST['wpcode_confirmation_code'] ) ) {
        $entered_code = sanitize_text_field( $_POST['wpcode_confirmation_code'] );
        $saved_code = get_user_meta( $user_id, 'wpcode_phone_confirmation_code', true );

        if ( $entered_code === $saved_code ) {
            update_user_meta( $user_id, 'wpcode_phone_confirmed', 1 );
            delete_user_meta( $user_id, 'wpcode_phone_confirmation_code' );
            $message = '<p style="color:green;">Телефон успешно подтвержден!</p>';
        } else {
            $message = '<p style="color:red;">Неверный код, попробуйте еще раз.</p>';
        }
    }

    ob_start();
    echo $message;
    ?>
    <form method="post">
        <p><label>Введите код подтверждения:</label><br>
        <input type="text" name="wpcode_confirmation_code" required /></p>
        <p><input type="submit" value="Подтвердить" /></p>
    </form>
    <?php
    return ob_get_clean();
}
add_shortcode( 'wpcode_phone_confirm', 'wpcode_phone_confirmation_form' );

Добавьте шорткод [wpcode_phone_confirm] на отдельную страницу «Подтверждение телефона», куда перенаправляйте пользователя после регистрации.

Дополнительные улучшения и безопасность

Для повышения удобства и безопасности можно:

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

Все это можно реализовать, расширяя приведенный пример и используя стандартные инструменты WordPress.

Выводы

Добавление поля телефона с подтверждением через SMS в регистрацию WordPress — задача, решаемая простыми хуками и API сторонних сервисов. Это повышает качество пользовательских данных и безопасность сайта. Приведенный пример поможет вам быстро внедрить такую функциональность, а при необходимости дополнить ее дополнительной логикой и улучшениями.

Если хотите готовое решение с тонкой настройкой, обратите внимание на плагины с поддержкой SMS-подтверждений или расширяйте данный код под свои задачи.

Для удобного управления регистрацией и SMS-оповещениями рекомендуем посмотреть WPRemark — плагин с расширенными возможностями кастомизации форм и уведомлений.

×

AI-плагин от WPShop.ru

анализирует конкурентов

пишет статьи

готовит SEO

генерирует изображения

и еще кое-что...
WPGPT
Плагин, который наполняет ваш сайт WordPress
Узнать больше