Как сделать отзывы с рейтингом в WordPress без плагинов

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

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

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

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

Создаем кастомный тип записей «Отзывы» и мета-поля для рейтинга

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

function wpcompany_register_reviews_cpt() {
    $labels = array(
        'name' => 'Отзывы',
        'singular_name' => 'Отзыв',
        'add_new' => 'Добавить отзыв',
        'add_new_item' => 'Добавить новый отзыв',
        'edit_item' => 'Редактировать отзыв',
        'new_item' => 'Новый отзыв',
        'view_item' => 'Просмотреть отзыв',
        'search_items' => 'Поиск отзывов',
        'not_found' => 'Отзывы не найдены',
        'not_found_in_trash' => 'В корзине отзывов не найдено',
        'menu_name' => 'Отзывы'
    );
    $args = array(
        'labels' => $labels,
        'public' => true,
        'has_archive' => true,
        'supports' => array('title', 'editor'),
        'menu_position' => 20,
        'menu_icon' => 'dashicons-star-filled',
    );
    register_post_type('wpcompany_review', $args);
}
add_action('init', 'wpcompany_register_reviews_cpt');

Теперь добавим мета-поле для рейтинга от 1 до 5. Для простоты воспользуемся стандартным сохранением мета-данных при сохранении записи. Добавим мета-бокс с рейтингом:

function wpcompany_add_review_meta_box() {
    add_meta_box('wpcompany_review_rating', 'Рейтинг', 'wpcompany_review_rating_callback', 'wpcompany_review', 'side');
}
add_action('add_meta_boxes', 'wpcompany_add_review_meta_box');

function wpcompany_review_rating_callback($post) {
    $rating = get_post_meta($post->ID, '_wpcompany_review_rating', true);
    if (!$rating) $rating = 0;
    echo '<label for="wpcompany_review_rating_field">Оценка (1-5):</label>';
    echo '<input type="number" id="wpcompany_review_rating_field" name="wpcompany_review_rating_field" min="1" max="5" value="' . esc_attr($rating) . '" style="width: 50px;" />';
}

function wpcompany_save_review_rating($post_id) {
    if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) return;
    if (isset($_POST['wpcompany_review_rating_field'])) {
        $rating = intval($_POST['wpcompany_review_rating_field']);
        if ($rating < 1) $rating = 1;
        if ($rating > 5) $rating = 5;
        update_post_meta($post_id, '_wpcompany_review_rating', $rating);
    }
}
add_action('save_post', 'wpcompany_save_review_rating');

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

Создаем форму добавления отзывов на фронтенде с AJAX

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

Добавим шорткод для вывода формы:

function wpcompany_review_form_shortcode() {
    ob_start();
    ?>
    <form id="wpcompany-review-form" method="post">
        <p><label for="wpcompany_review_name">Имя:</label><br />
        <input type="text" id="wpcompany_review_name" name="wpcompany_review_name" required /></p>

        <p><label for="wpcompany_review_text">Отзыв:</label><br />
        <textarea id="wpcompany_review_text" name="wpcompany_review_text" rows="5" required></textarea></p>

        <p><label for="wpcompany_review_rating">Рейтинг (1-5):</label><br />
        <input type="number" id="wpcompany_review_rating" name="wpcompany_review_rating" min="1" max="5" value="5" required /></p>

        <button type="submit">Отправить отзыв</button>
        <div id="wpcompany-review-message" style="margin-top:10px;color:green;"></div>
    </form>
    <script>
    document.getElementById('wpcompany-review-form').addEventListener('submit', function(e) {
        e.preventDefault();
        var form = this;
        var data = new FormData(form);
        data.append('action', 'wpcompany_submit_review');

        fetch(' + JSON.stringify(admin_url('admin-ajax.php')) + ', {
            method: 'POST',
            credentials: 'same-origin',
            body: data
        }).then(response => response.json()).then(json => {
            var messageEl = document.getElementById('wpcompany-review-message');
            if(json.success) {
                messageEl.style.color = 'green';
                messageEl.textContent = 'Спасибо за ваш отзыв!';
                form.reset();
            } else {
                messageEl.style.color = 'red';
                messageEl.textContent = json.data || 'Ошибка при отправке отзыва.';
            }
        });
    });
    </script>
    <?php
    return ob_get_clean();
}
add_shortcode('wpcompany_review_form', 'wpcompany_review_form_shortcode');

Теперь добавим обработчик AJAX на сервере:

function wpcompany_handle_submit_review() {
    // Проверяем поля
    $name = isset($_POST['wpcompany_review_name']) ? sanitize_text_field($_POST['wpcompany_review_name']) : '';
    $text = isset($_POST['wpcompany_review_text']) ? sanitize_textarea_field($_POST['wpcompany_review_text']) : '';
    $rating = isset($_POST['wpcompany_review_rating']) ? intval($_POST['wpcompany_review_rating']) : 0;

    if(empty($name) || empty($text) || $rating < 1 || $rating > 5) {
        wp_send_json_error('Пожалуйста, заполните все поля корректно.');
    }

    // Создаем новый отзыв
    $new_review = array(
        'post_title' => 'Отзыв от ' . $name,
        'post_content' => $text,
        'post_status' => 'pending', // сначала на модерацию
        'post_type' => 'wpcompany_review'
    );
    $post_id = wp_insert_post($new_review);

    if(is_wp_error($post_id) || !$post_id) {
        wp_send_json_error('Ошибка при сохранении отзыва.');
    }

    update_post_meta($post_id, '_wpcompany_review_rating', $rating);

    wp_send_json_success();
}
add_action('wp_ajax_wpcompany_submit_review', 'wpcompany_handle_submit_review');
add_action('wp_ajax_nopriv_wpcompany_submit_review', 'wpcompany_handle_submit_review');

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

Отображение отзывов с рейтингом на сайте

Чтобы вывести отзывы с рейтингом, напишем функцию-шорткод, которая выведет последние отзывы со звездочками рейтинга:

function wpcompany_display_reviews_shortcode($atts) {
    $atts = shortcode_atts(array('count' => 5), $atts, 'wpcompany_display_reviews');
    $args = array(
        'post_type' => 'wpcompany_review',
        'post_status' => 'publish',
        'posts_per_page' => intval($atts['count']),
        'orderby' => 'date',
        'order' => 'DESC'
    );
    $reviews = get_posts($args);

    if(empty($reviews)) {
        return '<p>Отзывы еще не добавлены.</p>';
    }

    ob_start();
    echo '<div class="wpcompany-reviews">';
    foreach($reviews as $review) {
        $rating = get_post_meta($review->ID, '_wpcompany_review_rating', true);
        $rating = intval($rating);

        echo '<div class="wpcompany-review" style="border:1px solid #ccc; padding:10px; margin-bottom:10px;">';
        echo '<h3>' . esc_html($review->post_title) . '</h3>';
        echo '<div class="wpcompany-review-rating">' . wpcompany_get_stars_html($rating) . '</div>';
        echo '<div class="wpcompany-review-content">' . wpautop(esc_html($review->post_content)) . '</div>';
        echo '</div>';
    }
    echo '</div>';
    return ob_get_clean();
}
add_shortcode('wpcompany_display_reviews', 'wpcompany_display_reviews_shortcode');

function wpcompany_get_stars_html($count) {
    $max = 5;
    $html = '';
    for($i = 1; $i <= $max; $i++) {
        if($i <= $count) {
            $html .= '<span style="color:gold; font-size:18px;">★</span>';
        } else {
            $html .= '<span style="color:#ccc; font-size:18px;">☆</span>';
        }
    }
    return $html;
}

Теперь на странице или в записи можно вставлять шорткод [wpcompany_display_reviews count="3"], чтобы вывести последние 3 отзыва с рейтингом.

Советы по улучшению и безопасности

1. Добавьте nonce-поля в форму и проверяйте их в обработчике AJAX для защиты от CSRF.

2. Реализуйте капчу или ограничение по частоте отправки отзывов, чтобы избежать спама.

3. Настройте уведомления на почту администратору о новых отзывах для быстрой модерации.

4. Можно добавить пользовательские поля, например, Email или URL сайта автора.

5. Для улучшения внешнего вида используйте CSS и иконки из библиотек, например, FontAwesome.

Заключение по внедрению отзывов с рейтингом без плагинов

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

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