Создание пользовательских полей комментариев в WordPress: практическое руководство

# Создание новых полей для комментариев в WordPress

Иногда необходимо добавить пользовательские поля в форму комментариев WordPress, например, поле для ввода номера телефона, адреса, заголовка комментария и т.д. Здесь нам помогут хуки WordPress (события и фильтры), позволяющие изменить стандартные функции платформы и добавить новые поля в комментарии.

В этой статье мы добавим три новых поля в форму комментариев WordPress:

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

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

## Как лучше создать новые поля?

Вы можете расширить форму комментариев, редактируя оригинальную тему, создавая дочернюю тему или разрабатывая плагин. Модернизировать оригинальную тему проще, чем создавать дочернюю, но есть один большой недостаток: все изменения будут потеряны при обновлении темы. Наилучший вариант — создать плагин, поскольку изменённая форма комментариев будет работать с любой темой (кроме тех, где форма комментариев добавляется нестандартным образом).

Итак, давайте создадим плагин для WordPress, это очень просто. Назовём его "Расширенные комментарии".

### Содержание:

- Создание плагина для расширения формы комментариев
- Создание полей для неавторизованных пользователей
- Создание полей для всех пользователей
- Сохранение данных из полей на фронтенде
- Проверка заполненности обязательных полей
- Отображение содержимого метаполей на фронтенде
- Отображение метаполей в админ-панели
- Сохранение метаполей в админ-панели
- Удаление плагина (деинсталляция)
- Отображение средней оценки
- Заключение

## Создание плагина для расширения формы комментариев

Создайте новую папку с названием extend-comment в папке плагинов, а внутри неё файл extend-comment.php. Чтобы WordPress увидел плагин, нужно указать специальные заголовки:

```php

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

Создание полей для неавторизованных пользователей

Мы подключаемся к фильтру comment_form_default_fields и "расширяем" массив с полями по умолчанию (автор, email, url). В коде ниже мы заменяем стандартные поля формы и добавляем новое поле "Телефон".

add_filter( 'comment_form_default_fields', 'extend_comment_custom_default_fields' );

function extend_comment_custom_default_fields( $fields ) {
    $commenter = wp_get_current_commenter();
    $req_name_email = get_option( 'require_name_email' );

    $fields['author'] = sprintf(
        '

            %s%s
            
        
',
        __( 'Имя' ),
        $req_name_email ? '*' : '',
        esc_attr( $commenter['comment_author'] ),
        $req_name_email ? " aria-required='true'" : ''
    );

    $fields['email'] = sprintf(
        '

            %s%s
            
        
',
        __( 'Email' ),
        $req_name_email ? '*' : '',
        esc_attr( $commenter['comment_author_email'] ),
        $req_name_email ? " aria-required='true'" : ''
    );

    $fields['url'] = sprintf(
        '

            %s
            
        
',
        __( 'Сайт' ),
        esc_attr( $commenter['comment_author_url'] )
    );

    $fields['phone'] = sprintf(
        '

            %s
            
        
',
        __( 'Телефон' )
    );

    return $fields;
}

Поля отображаются, когда пользователь не авторизован. Если пользователь авторизован, будет показано только поле для ввода комментария.

Создание полей для всех пользователей

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

// Добавляем поля для всех пользователей
add_action( 'comment_form_logged_in_after', 'extend_comment_custom_fields' );
add_action( 'comment_form_after_fields', 'extend_comment_custom_fields' );

function extend_comment_custom_fields() {
    echo '
'.
        '' . __( 'Заголовок комментария' ) . ''.
        '
';

    echo '
'.
        ''. __('Оценка') . '*
        ';

    for( $i=1; $i <= 5; $i++ ){
        echo '
        
             '. $i .'   
        ';
    }

    echo'
';
}

Чтобы отобразить 5 радиокнопок для оценки, мы используем цикл. Этот код можно кастомизировать, например, вместо 5 указать 10.

Сохранение данных из полей на фронтенде

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

add_action( 'comment_post', 'save_extend_comment_meta_data' );

function save_extend_comment_meta_data( $comment_id ){
    if( !empty( $_POST['phone'] ) ){
        $phone = sanitize_text_field( $_POST['phone'] );
        add_comment_meta( $comment_id, 'phone', $phone );
    }

    if( !empty( $_POST['title'] ) ){
        $title = sanitize_text_field( $_POST['title'] );
        add_comment_meta( $comment_id, 'title', $title );
    }

    if( !empty( $_POST['rating'] ) ){
        $rating = intval( $_POST['rating'] );
        add_comment_meta( $comment_id, 'rating', $rating );
    }
}

Не забудьте, что для обеспечения безопасности мы очищаем поля, используя функцию sanitize_text_field().

Теперь после размещения комментария в базе данных будут храниться подобные записи.

Проверка заполненности обязательных полей

Мы сделали поле оценки обязательным. Однако в данный момент комментарий публикуется, даже если это поле не заполнено. Реализуем механизм проверки. Для этого используем фильтр preprocess_comment, и если оценка не выставлена, выводим сообщение об ошибке и не добавляем комментарий в базу данных:

// Проверяет, заполнено ли поле "Оценка"
add_filter( 'preprocess_comment', 'verify_extend_comment_meta_data' );

function verify_extend_comment_meta_data( $commentdata ) {
    if ( isset( $_REQUEST['action'] ) && $_REQUEST['action'] === 'replyto-comment' ) {
        return $commentdata;
    }

    if ( empty( $_POST['rating'] ) || ! (int)$_POST['rating'] ) {
        wp_die( __( 'Ошибка: Вы не добавили оценку. Нажмите кнопку "Назад" в вашем веб-браузере и отправьте комментарий с оценкой.' ) );
    }

    return $commentdata;
}

Отображение содержимого метаполей на фронтенде

Мы научились добавлять метаданные. Теперь нужно получить и отобразить метаданную комментария. Чтобы получить метаданные, используем функцию get_comment_meta().

Чтобы изменить код формы и добавить необходимые данные в неё, можем использовать фильтр comment_text.

Два варианта отображения оценки

Рассмотрим 2 варианта отображения оценки.

Звёздные оценки на основе пользовательских изображений

В первом варианте мы будем отображать изображения звёзд, которые должны находиться в виде файлов в папке плагина:

add_filter( 'comment_text', 'modify_extend_comment');

function modify_extend_comment( $text ){
    $plugin_url_path = WP_PLUGIN_URL;

    if( $commenttitle = get_comment_meta( get_comment_ID(), 'title', true ) ) {
        $commenttitle = '' . esc_attr( $commenttitle ) . '
';
        $text = $commenttitle . $text;
    }

    if( $commentrating = get_comment_meta( get_comment_ID(), 'rating', true ) ) {
        $commentrating = '

Оценка: '. $commentrating .' / 5
';
        $text = $text . $commentrating;
        return $text;
    } else {
        return $text;
    }
}

Звёздные оценки на основе шрифта Dashicons

Второй вариант выполняет ту же задачу, но здесь мы будем использовать встроенную функцию WordPress wp_star_rating(), которая сама добавит красивые значки звёзд:

add_filter( 'comment_text', 'modify_extend_comment');

function modify_extend_comment( $text ){
    global $post;

    if( $commenttitle = get_comment_meta( get_comment_ID(), 'title', true ) ) {
        $commenttitle = '' . esc_attr( $commenttitle ) . '
';
        $text = $commenttitle . $text;
    }

    if( $commentrating = get_comment_meta( get_comment_ID(), 'rating', true ) ) {
        $commentrating = wp_star_rating( array (
            'rating' => $commentrating,
            'echo'=> false
        ));

        $text = $text . $commentrating;
    }

    return $text;
}

Отображение метаполей в админ-панели

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

Для этого мы добавим метаполя на страницу редактирования комментария с помощью хуков add_meta_boxes_comment и функции add_meta_box(). Иными словами, мы будем ждать события add_meta_boxes_comment (начала рендеринга стандартных полей) и добавим новые поля.

add_action( 'add_meta_boxes_comment', 'extend_comment_add_meta_box' );

function extend_comment_add_meta_box(){
    add_meta_box( 'title', __( 'Метаданные комментария - Расширенные комментарии' ), 'extend_comment_meta_box', 'comment', 'normal', 'high' );
}

function extend_comment_meta_box( $comment ){
    $phone  = get_comment_meta( $comment->comment_ID, 'phone', true );
    $title  = get_comment_meta( $comment->comment_ID, 'title', true );
    $rating = get_comment_meta( $comment->comment_ID, 'rating', true );

    wp_nonce_field( 'extend_comment_update', 'extend_comment_update', false );
    ?>
    

        
        
    
    

        
        
    
    

        
        
        
                
            ';
        }
        ?>
        
    
    

add_action( 'edit_comment', 'extend_comment_edit_meta_data' );

function extend_comment_edit_meta_data( $comment_id ) {
    if( ! isset( $_POST['extend_comment_update'] ) || ! wp_verify_nonce( $_POST['extend_comment_update'], 'extend_comment_update' ) )
        return;

    if( !empty($_POST['phone']) ){
        $phone = sanitize_text_field($_POST['phone']);
        update_comment_meta( $comment_id, 'phone', $phone );
    }
    else
        delete_comment_meta( $comment_id, 'phone');

    if( !empty($_POST['title']) ){
        $title = sanitize_text_field($_POST['title']);
        update_comment_meta( $comment_id, 'title', $title );
    }
    else
        delete_comment_meta( $comment_id, 'title');

    if( !empty($_POST['rating']) ){
        $rating = intval($_POST['rating']);
        update_comment_meta( $comment_id, 'rating', $rating );
    }
    else
        delete_comment_meta( $comment_id, 'rating');
}

if( ! defined('WP_UNINSTALL_PLUGIN') ) exit;

global $wpdb;

$wpdb->query(
    "DELETE FROM $wpdb->commentmeta
    WHERE meta_key IN ( 'phone', 'title', 'rating' )"
);

/**
 * Возвращает среднюю оценку поста.
 *
 * @return string
 */
get_the_extend_comment_post_rating();

// Если была 3 оценки (4, 4, 3), выводится 3.6666666666666665
echo get_the_extend_comment_post_rating();

/**
 * Возвращает HTML-блок со средней оценкой в виде звёзд для текущего поста.
 *
 * @see wp_star_rating()
 *
 * @return string
 */
get_the_extend_comment_post_star_rating();

// Пусть оценки будут такие же, как в примере выше.
echo get_the_extend_comment_post_star_rating();