Функция wp_star_rating() в WordPress используется для генерации HTML-разметки со звездным рейтингом на основе заданного значения. Рейтинг может быть указан в виде числа (например, 4.5) или в процентах (например, 80%). Эта функция поддерживает отображение на фронтенде, если подключены необходимые CSS-иконки.
wp_star_rating( array $args = array() ): string
Функция wp_star_rating() позволяет отображать звездный рейтинг в диапазоне от 0 до 5 с шагом 0.5, что делает её полезной для обзоров, оценок пользователей и других показателей. В результате функция генерирует HTML-разметку с нужным количеством звезд, отображая полный, пустой или половинчатый значок в зависимости от значения рейтинга.
Параметры
- $args (array) — Массив аргументов для настройки звездного рейтинга:
- rating (int|float) — Числовое значение рейтинга (например,
4.5) или процентное значение (например,80). По умолчанию0. - type (string) — Тип переданного значения рейтинга. Принимает
rating(по умолчанию) илиpercent. - number (int) — Число отзывов, участвующих в оценке (опционально). Добавляется в атрибут
title. - echo (bool) — Выводить результат сразу (
true) или вернуть HTML как строку (false). По умолчаниюtrue.
- rating (int|float) — Числовое значение рейтинга (например,
Возвращаемое значение
- string — HTML-разметка с рейтингом, готовая к вставке в HTML-код страницы.
Пример 1: Отображение звездного рейтинга по числовому значению
Допустим, нужно вывести рейтинг 3.5 из 5, который основан на 2300 голосах. Пример кода:
$args = array(
'rating' => 3.5,
'type' => 'rating',
'number' => 2300
);
wp_star_rating( $args );
Вывод HTML:
<div class="star-rating" title="Рейтинг 3.5 на основе 2300 голосов">
<div class="star star-full"></div>
<div class="star star-full"></div>
<div class="star star-full"></div>
<div class="star star-half"></div>
<div class="star star-empty"></div>
</div>
Пример 2: Вывод рейтинга в процентах
Если рейтинг указан в процентах, например, 90%, то отобразится соответствующее количество звезд:
$args = array(
'rating' => 90,
'type' => 'percent',
'number' => 450
);
wp_star_rating( $args );
Вывод HTML:
<div class="star-rating" title="Рейтинг 4.5 на основе 450 голосов">
<div class="star star-full"></div>
<div class="star star-full"></div>
<div class="star star-full"></div>
<div class="star star-full"></div>
<div class="star star-half"></div>
</div>
Пример 3: Использование на фронтенде
Для отображения рейтинга на фронтенде необходимо подключить Dashicons и CSS для стилей звезд. Пример подключения и использования:
// Подключение Dashicons на фронтенде
add_action( 'wp_enqueue_scripts', function() {
wp_enqueue_style( 'dashicons' );
});
require_once ABSPATH . 'wp-admin/includes/template.php';
echo wp_star_rating(array(
'rating' => 4.0,
'type' => 'rating',
'number' => 305,
'echo' => false
));
CSS стили для отображения
Для корректного отображения на фронтенде добавим стили для классов звезд. Пример стилей:
.star-rating .star-full:before {
content: "\f155";
}
.star-rating .star-half:before {
content: "\f459";
}
.star-rating .star-empty:before {
content: "\f154";
}
.star-rating .star {
color: #0074A2;
display: inline-block;
font-family: dashicons;
font-size: 20px;
width: 20px;
height: 20px;
vertical-align: middle;
}
Заключение
Функция wp_star_rating() упрощает задачу отображения звездного рейтинга в WordPress. Она гибко настраивается и позволяет выводить рейтинг на основе чисел или процентов.