Плагин YARPP (Yet Another Related Posts Plugin) — один из самых популярных инструментов для вывода связанных записей в WordPress. По умолчанию он использует стандартные шаблоны, которые далеко не всегда соответствуют дизайну вашего сайта. В этой статье мы подробно рассмотрим, как создать собственные кастомные шаблоны для YARPP, чтобы полностью контролировать внешний вид и поведение блока связанных записей.
Почему стоит создавать кастомные шаблоны для YARPP
Стандартные шаблоны YARPP имеют базовый, минималистичный дизайн, который подходит далеко не для всех тем WordPress. Использование кастомных шаблонов позволяет:
- Сделать блок связанных записей более привлекательным и соответствующим стилю сайта.
- Добавить дополнительные данные к связанным записям, например, короткие описания, даты или миниатюры в разных стилях.
- Оптимизировать вывод для мобильных устройств.
- Внедрить собственные CSS-классы для более тонкой стилизации.
В итоге вы получаете не просто список ссылок, а полноценный блок с интересным и удобным для пользователей выводом.
Где размещать кастомные шаблоны YARPP
Все кастомные шаблоны для YARPP должны находиться в папке вашей активной темы или дочерней темы, в каталоге yarpp-templates. Если такой папки нет, создайте её:
wp-content/themes/your-theme/yarpp-templatesВ эту папку вы будете складывать файлы шаблонов — это простые PHP-файлы, в которых описана разметка вывода связанных записей.
Структура кастомного шаблона YARPP
Каждый шаблон должен содержать цикл по массиву $related_posts — именно в нем хранится список связанных записей, подобранных YARPP. Вот базовый пример шаблона в файле yarpp-templates/custom-template.php:
<?php
if (empty($related_posts)) {
echo '<p>Похожие записи не найдены.</p>';
return;
}
echo '<div class="yarpp-custom-list">';
foreach ($related_posts as $post) {
setup_postdata($post);
?>
<div class="yarpp-item">
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php if (has_post_thumbnail()) {
the_post_thumbnail('thumbnail');
} ?>
<h4><?php the_title(); ?></h4>
</a>
<div class="yarpp-excerpt"><?php echo wp_trim_words(get_the_excerpt(), 20); ?></div>
</div>
<?php
}
wp_reset_postdata();
echo '</div>';
?>В этом примере выводятся миниатюра записи, заголовок и урезанный по длине отрывок. Вы можете подстроить верстку под свои нужды.
Подключение кастомного шаблона в настройках YARPP
Чтобы использовать созданный шаблон, зайдите в админку WordPress в раздел Настройки > Связанные записи (YARPP). В блоке Display options найдите пункт Custom Display Options и укажите имя вашего файла шаблона без расширения, например, custom-template.
После сохранения изменений плагин начнёт использовать ваш шаблон для вывода связанных записей.
Пример расширенного шаблона с дополнительными данными
Давайте создадим шаблон, который будет показывать не только заголовок и миниатюру, но и рубрики записи и дату публикации:
<?php
if (empty($related_posts)) {
echo '<p>Похожие записи не найдены.</p>';
return;
}
echo '<ul class="yarpp-extended-list">';
foreach ($related_posts as $post) {
setup_postdata($post);
$categories = get_the_category();
$cats_output = [];
foreach ($categories as $cat) {
$cats_output[] = '<a href="' . esc_url(get_category_link($cat->term_id)) . '">' . esc_html($cat->name) . '</a>';
}
?>
<li class="yarpp-item-extended">
<div class="yarpp-thumb"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('medium'); ?></a></div>
<div class="yarpp-meta">
<h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<div class="yarpp-categories"><?php echo implode(', ', $cats_output); ?></div>
<time datetime="<?php echo get_the_date('c'); ?>"><?php echo get_the_date(); ?></time>
</div>
</li>
<?php
}
wp_reset_postdata();
echo '</ul>';
?>Такой шаблон отлично подойдет для новостных или блоговых сайтов, где важен контекст публикации.
Использование хуков для расширения функционала YARPP
Если вам нужно динамически изменять вывод или данные связанных записей, YARPP предоставляет несколько фильтров и хуков. Например, фильтр yarpp_related позволяет изменить список связанных записей перед выводом:
function yarppru_filter_related_posts($related_posts, $post_id) {
// Пример: исключить из результатов записи с определенной меткой
foreach ($related_posts as $key => $post) {
if (has_tag('exclude-from-related', $post->ID)) {
unset($related_posts[$key]);
}
}
return $related_posts;
}
add_filter('yarpp_related', 'yarppru_filter_related_posts', 10, 2);С помощью этого кода вы можете гибко контролировать, какие записи попадут в блок связанных.
Советы по стилизации кастомных шаблонов YARPP
После создания шаблона нужно добавить CSS для красивого и адаптивного отображения. Вот базовые рекомендации:
- Используйте уникальные классы, например,
.yarpp-custom-listили.yarpp-extended-list, чтобы не влиять на другие элементы темы. - Добавьте отступы и выравнивание, чтобы блок не сливался с остальным контентом.
- Для изображений используйте
max-width: 100%и фиксированную высоту, если нужно сохранить пропорции. - Не забывайте о мобильной адаптивности — применяйте медиа-запросы.
Пример базового CSS:
.yarpp-custom-list {
display: flex;
flex-wrap: wrap;
gap: 20px;
}
.yarpp-item {
width: 200px;
border: 1px solid #ddd;
padding: 10px;
box-sizing: border-box;
}
.yarpp-item img {
max-width: 100%;
height: auto;
display: block;
margin-bottom: 8px;
}Интеграция с плагинами WPShop для улучшения связанных записей
Если вы используете на сайте продукты WPShop, например, Clearfy Pro, он поможет оптимизировать работу YARPP, отключая лишние запросы и ускоряя выборку связанных записей.
Плагин WPRemark можно использовать для добавления отзывов и комментариев к связанным записям прямо в блоке YARPP, что повышает вовлеченность пользователей.
Заключение
Создание кастомных шаблонов для YARPP — простой и мощный способ сделать вывод связанных записей более профессиональным и привлекательным. Правильное размещение шаблонов, использование циклов и хуков, а также грамотная стилизация позволяют адаптировать плагин под любые задачи и дизайн. Используйте примеры из статьи как отправную точку и развивайте функционал под свои нужды.