Как вывести похожие записи, статьи без плагина на WordPress

Главная » Создание блога » Обходимся без плагинов » Как вывести похожие записи или статьи без плагина на WordPress

Как вывести похожие записи или статьи без плагина на WordPress

2013-04-01 автор: Виталий Кириллов

Всем привет! В этот раз на SEO-Mayak.com я продемонстрирую: как вывести похожие записи или статьи на WordPress без плагина.

Существует масса плагинов для вывода похожих статей, такие как: Simple Tags, Similar Posts или Yet another related posts.

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

Известно, что плагины не хило нагружают сервер и значительно снижают скорость загрузки страницы. Заметно это становится не сразу, а со временем, когда блог наполнится контентом и посещаемость будет стремится к 1000 уников.

pohojie zapisi wordpress

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

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

Два способа вывода похожих записей или статей без плагина

Обращаюсь к начинающим веб-мастерам. Ребята, не бойтесь Вы этих кодов, не такие они и страшные. Если вы опасаетесь напороть косяков, то установите себе на компьютер локальный сервер и проводите на нем эксперименты. Я сам, до сих пор все новшества сначала испытываю на локалке и только потом уже готовые решения переношу на свои реальные блоги.

Похожие статьи или записи, также как и хлебные крошки, относятся к внутренней переленковке, которая безусловно положительно влияет на поведенческие факторы.

Так что выводить похожие записи надо обязательно!

И так, приступим к рассмотрению вариантов кодов вывода похожих записей на WordPress без плагинов.

Обычно блок похожих записей располагается под статьей, а за вывод статей отвечает файл single.php, с которым мы и будем работать. Напомню, что файл single.php находиться в папке с Вашей темой: wp-content -> themes -> Название темы, а для редактирования файлов советую пользоваться бесплатным текстовым редактором Notepad++.

Способ №1. Функция сортировки похожих статей по меткам (тегам)

Многие веб-мастера используют теги или метки, которые служат для связки статей со схожими темами, но при этом записи могут находиться в разных категориях. Вставляем этот код в файл single.php под статьей.

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

<div class="similar_records">
<h3>Похожие записи:</h3>
<?php $tags = wp_get_post_tags($post->ID);
if ($tags) {
 $tag_ids = array();
 foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
 $args=array(
 'tag__in' => $tag_ids, // Сортировка производится по тегам
 'post__not_in' => array($post->ID),
 'showposts'=>5 // Цифра означает количество выводимых записей
 );
 $my_query = new wp_query($args);
 if( $my_query->have_posts() ) {
 echo '<ul>';
        while ($my_query->have_posts()) {
            $my_query->the_post();
        ?>
            <li><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></li>
        <?php
        }
        echo '</ul>';
    }
 wp_reset_query();
 }
 ?></div>

Если в коде ничего не менять, то вывод похожих статей будет будет осуществятся по тегам (меткам), но с учетом даты, начиная с самих свежих. Для того, чтобы статьи выводились рандом (в случайном порядке), то необходимо добавить еще одну строчку:

'orderby'=>rand,

Прописываем это условие после 9 строки:

'tag__in' => $tag_ids,

Также не лишнем будет добавить еще одно условие:

'caller_get_posts'=>1,

Которое запрещает повторение одной и той же ссылки. Например, у Вас на блоге еще небольшое количество статей, а вы в коде указали вывод по 10 ссылок:

'showposts'=>10,

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

В итоге у нас должен получится такой код:

<div class="similar_records">
<h3>Похожие записи:</h3>
<?php $tags = wp_get_post_tags($post->ID);
if ($tags) {
 $tag_ids = array();
 foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
 $args=array(
 'tag__in' => $tag_ids, // Сортировка происходит по тегам (меткам)
 'orderby'=>rand, // Добавляем условие сортировки рандом (случайный подбор)
 'caller_get_posts'=>1, // Запрещаем повторение ссылок
 'post__not_in' => array($post->ID),
 'showposts'=>5 // Цифра означает количество выводимых записей
 );
 $my_query = new wp_query($args);
 if( $my_query->have_posts() ) {
 echo '<ul>';
        while ($my_query->have_posts()) {
            $my_query->the_post();
        ?>
            <li><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></li>
        <?php
        }
        echo '</ul>';
    }
 wp_reset_query();
 }
 ?></div>

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

Способ №2. Функция сортировки похожих статей по рубрикам (категориям)

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

<div class="similar_records">
<h3>Похожие записи:</h3>
<?php $categories = get_the_category($post->ID);
if ($categories) {
 $category_ids = array();
 foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
 $args=array(
 'category__in' => $category_ids, // Сортировка производится по категориям
 'orderby'=>rand, // Условие сортировки рандом
 'post__not_in' => array($post->ID),
 'showposts'=>5, //Количество выводимых записей
 'caller_get_posts'=>1); // Запрещаем повторение ссылок
 $my_query = new wp_query($args);
 if( $my_query->have_posts() ) {
echo '<ul>';
        while ($my_query->have_posts()) {
            $my_query->the_post();
        ?>
            <li><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></li>
        <?php
        }
        echo '</ul>';
    }
wp_reset_query();
}
?></div>

Я сразу включил условие сортировки рандом, но если вы хотите установить сортировку по датам, то просто уберите строчку:

'orderby'=>rand,

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

Стили для блока похожих записей

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

pohojie zapisi1

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

class="similar_records"

За стили отвечает файл style.css, который также находиться в папке с темой.

В качестве примера я приведу список стилей для похожих записей со своего блога с подробными разъяснениями.

/*похожие записи*/

.similar_records a{     /*  "а" в конце класса означает, что все стили прописываются для ссылок  */
 background:#F6F9FD url(images/st.gif) no-repeat left;    /*  Цвет фона и адрес картинки перед каждой ссылкой */
 border-bottom-left-radius: 5px;   /* Закругление левого нижнего края фона в пикселях */
 border-bottom-right-radius: 5px;  /* Закругление правого нижнего края фона в пикселях */
 border-top-left-radius: 5px;  /* Закругление левого верхнего края фона в пикселях */
 border-top-right-radius: 5px;  /* Закругление правого верхнего края фона в пикселях */
 color: #444444;  /* Цвет самой ссылки */
 display: block;  /* Обозначаем элемент как блочный */
 margin: 5px 0;  /* Внешние отступы, в данном случаи указываем расстояние между ссылками */
 padding: 5px 5px 5px 5px;  /* Внутренние отступы */
 position: relative;  /* Привязываем блок к реальному местоположению в файле */
 text-decoration: none; /* Отменяем подчеркивание ссылок и элементов списка (1,2,3 и т.д.)
}

.similar_records a:hover{
color: #C6C600;   /* Цвет ссылки при наведении курсора */
}

Не бойтесь менять значения отступов, цвет фона или ссылок, подгоняйте стили под дизайн Вашего шаблона. Ничего такого страшного нет, самое главное не забывайте ставить «;» в конце строчки. Если Вы используете редактор Noteped++, то подсветка синтаксиса будет вам подсказывать, где закралась ошибка. Успехов!

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

На сегодня у меня все. Как Вам статья?

С уважением, Виталий Кириллов