Wordpress похожие. Плагины для отображения похожих записей WordPress
Друзья, всем привет. Сегодня поговорим о том, как создать список похожих статей в WordPress без плагина. Похожие материалы улучшают поведенческие факторы. Обычно их размещают в конце статьи, так чтобы посетитель мог ознакомиться с другими статьями по теме.
Таким образом, если вы заинтересовали посетителя, то он задержится на вашем сайте подольше, а похожие статьи помогут ему лучше разобраться в решении его проблемы.
Создать список похожих статей с миниатюрами и без, можно чистым кодом php или плагином. Каждый выбирает свой путь.
До недавнего времени у меня на блоге использовался для этого плагин WordPress Related Posts. Хороший плагин, красиво можно оформить, под любой дизайн, вывод похожих статей.
Только вот в борьбе за скорость загрузки сайт я решил заменить этот плагин на простой код. Потому что этот плагин тормозил загрузку моего блога от 0,5 до 0,9 секунды в зависимости от времени и нагрузки.
И поэтому я решил использовать код php для вывода похожих статей, который позволяет выводить статьи, сортирую их по тегам или категориям (рубрикам).
Как правило, список похожих статей выводится в конце статьи. В большинстве тем WordPress за статьи (записи) отвечает файл single.php. Именно в этот файл нужно вставить код, отвечающий за вывод похожих статей.
Предупреждение: сделайте резервную копию файла single.php перед началом работ.
Шаг 1: поиск места для вставки кода.
У всех нас разные шаблоны и структура их немного отличается друг от друга. К примеру, в моей теме, вообще, нет файла single.php. Я создал , и все доработки делаю через файл функции темы. А это на порядок сложней, чем править обычные файлы.
Для определения правильного места вставки кода, вам нужно сначала посмотреть на станицу, найти на ней основные элементы и тогда в исходном коде вам будет проще найти необходимое место для код.
Как видно на скриншоте, подходящее место для вставки кода, находится после окончания статьи, перед навигацией.
Итак, открываете административную панель Вордпресс – «Внешний вид» — «Редактор» — «Одна запись (single. php)». И в файле ищите код, отвечающий за вывод статьи. Выглядеть он будет примерно так:
...
После этого фрагмента можно вставить код похожих статей. В моём примере дальне будет идти код навигации.
Шаг 2: вставка кода похожих статей.
После того как вы определились с местом, вставляете вот этот код:
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), "posts_per_page"=>5 , // Количество вывода похожих статей. "ignore_sticky_posts"=>1); $my_query = new wp_query($args); if($my_query->have_posts()) { echo "-
";
while ($my_query->have_posts()) {
$my_query->the_post();
?>
- " rel="bookmark" title="Перейти к статье "> "; } } $post = $backup; wp_reset_query(); ?>
- " rel="bookmark" title="Перейти к статье "> "; } } $post = $backup; wp_reset_query(); ?>
- Score (по умолчанию) — сортирует по сходству записей
- Date — сортировка по дате статей
- Title — сортировка по заголовку статей в алфавитном порядке
-
" rel="bookmark" title="
">
"
;
}
wp_reset_query()
;
}
?>
- " rel="bookmark" title="">
- Если заменить строку "category__in" => $category_ids, на такую: "tag__in" => $tag_ids, то сортировка похожих записей будет осуществляться по тегам.
- В этом коде следует обратить внимание также на строку "orderby"=>rand, . Она отвечает за случайный порядок вывода ссылок на записи. Если вы хотите, чтобы записи были показаны согласно датам создания, эту строку следует убрать.
- Cтрока "caller_get_posts"=>1 запрещает повторение записей под постом.
- Cтрока "showposts"=>3, указывает на количество выводимых записей.
Теперь после каждой статьи будет выводиться список похожих статей, релевантность которых определяется по тегам.
Внешний вид списка будет соответствовать дизайну вашего сайта, так как стили, определённые в шаблоне, распространяются и на этот список.
Но, если вы захотите внести изменения в стили, то вы всегда можете использовать класс relatedPosts и задать свои стили. Этот класс я уже добавил в основу списка.
Также вы можете изменить в коде элементы, отмеченные оранжевым цветом.
К примеру, вы захотите вывести похожие статьи не по тегам, а по категории. Предложив посетителю, ознакомится с похожими материалами из этой категории.
Тогда, действуя по описанному выше алгоритму, вы вставляете вот этот код:
Похожие статьи из категории:
- ";
while ($my_query->have_posts()) {
$my_query->the_post();
?>
Этот код сортирует статьи только по категории. Теги уже не играют никакой роли.
Вывод похожих записей в WordPress является хорошим методом удержать посетителей на вашем сайте. Плагинов для реализации схожих записей достаточно много, и одним из самых популярных является плагин Yet Another Related Posts Plugin, или сокращённо YARPP.
Установка и настройка плагина
Скачать плагин вы можете бесплатно из официальной директории WordPress.org , или же установить автоматически через панель администрирования WordPress зайдя в раздел Плагины → Добавить новый. После установки и активации плагина, в меню Параметры вы найдёте новый пункт «Связанные посты» для его настройки.
В этом разделе вы можете настроить внешний вид и параметры работы плагина: выбрать между отображением списком, или миниатюрами, задать количество выводимых записей, установить текст заголовка для раздела с похожими записями, а так же выбрать метод сортировки:
Учтите, что сортировка применяется к уже отобранным результатам. Это означает что при сортировке по дате, ваши новые статьи не войдут в список, если они не имеют сходства с текущей статьёй.
Стоит так же отметить раздел с настройками для RSS ленты. Здесь вы можете включить отображение похожих записей в вашей RSS ленте. Это эффективно особенно в том случае, если вы публикуете полные статьи в RSS ленте WordPress, а не только их анонсы.
После настройки плагина вы можете увидеть его в действии при переходе на любую вашу статью.
Как администратор сайта в скобках к каждой выбранной статье вы увидите значение её релевантности к основной статье в виде коэффициента. Посетители вашего сайта и читатели RSS ленты этих значений не увидят.
Как YARPP влияет на скорость загрузки сайта
Перебрать все статьи и найти между ними сходство — задача не из лёгких, особенно если у вас более десятка тысяч записей. К счастью в YARPP есть встроенный механизм кэширования результатов, который позволяет выполнять сложные расчёты лишь один раз.
Тем не менее, при наличии большого количества записей в WordPress, вы можете заметить снижение скорости при публикации и редактировании записей. Это связано с перерасчётом релевантности в момент изменения содержания, и не влияет на скорость загрузки сайта для ваших посетителей.
Режим Custom/PHP
В настройках плагина YARPP вы можете выбрать между выводом схожих статей списком, или сеткой с миниатюрами. Есть и третий режим для более продвинутых пользователей, который позволяет полностью изменить разметку вывода похожих статей.
При активации режима Custom, YARPP создаст несколько дополнительных шаблонов для примера в вашей теме. Вы можете использовать их для создания собственного шаблона вывода схожих статей со своей собственной разметкой. Это хорошо сочетается с возможностью выводить схожие статьи в любом месте вашей темы с помощью функции плагина related_posts() .
YARPP Experiments
Если вы работаете над сайтом с огромным количеством статей и под высокой нагрузкой, то вам будет интересен плагин YARPP Experiments . Это официальный плагин от разработчика YARPP, который добавляет дополнительные настройки к основному плагину, включая управление кэшированием, снижение скорости расчётов схожести (поможет снизить нагрузку на сервер) и другие.
Если у вас возникли вопросы при использовании плагина YARPP, оставьте его в комментариях или задайте его нам в
Если вы хотите чтобы пользователи оставались и больше времени проводили на вашем сайте, помочь в этом может список связных (похожих) постов после статьи. Как правило, они отбираются смежных тематик, поэтому с определенной долей вероятности тот или иной пользователь может пройтись по другим статьям блога (справедливо это, конечно, только для СДЛ проектов). В последних нескольких статьях я уже рассмотрел парочку полезных плагинов для создания подобных списков — и . Первый весьма прост и функционален, но второй предоставляет сразу «из коробки» возможность добавления миниатюр (thumbnails) для этих самых похожих постов. Картинки все же лучше привлекают внимание пользователей чем обычные ссылки, поэтому сегодня предлагаю рассмотреть еще пять отличных плагинов, которые помогут реализовать такую функциональность.
Думаю, все сейчас используют для отображения картинок в wordpress блоге — это действительно очень удобно. Разработчикам вообще открываются дополнительные возможности для маневра — сможете легко выводить их на сайте через файлы шаблона или с помощью специальных модулей. Это гораздо проще чем я когда-то мучился реализовывая функцию , который никогда их не поддерживал. Кстати, после этих «улучшений» список связных постов в одном из блогов приятно преобразился:
Согласитесь, смотрится получше обычных ссылок. Именно поэтому следующие плагины вам должны понравится! За исследования и находку спасибо автору статьи Get Sticky with Thumbnails . В ней приводится не только короткое описание модулей, но и указание их плюсов и недостатков. В конце поста найдете сравнительную таблицу по разным критериям. Итак, поехали…
1. IGIT Related Posts With Thumb Image After Post
Только я начал рассматривать первый плагин как появились «небольшие проблемы». Модуль был актуален около года назад, но по непонятным мне причинам на wordpress.org его больше нет. Основная моя версия — там имелись определенные проблемы с безопасностью, но многие утверждают, что это «заслуга» не модуля а известной WP уязвимости с файлом timthumb.php. Видимо, из-за этого модуль GIT Related Posts больше недоступен, тем не менее, в интернете в блогах я нашел 2-3 источника (в рунете бесплатно, в англоязычном сегменте за $15), где ошибки исправлены и можно плагин скачать.
А он был весьма и весьма хорош, та как содержал множество опций для управления расположением миниатюр, их размерами, количеством, цветовым оформлением, шрифтами и т.п.
Плюсы:
возможно выбора горизонтального и вертикального отображения, а также большое число настроек.
Недостатки:
не всегда хорошо изменяет размер для миниатюр и, похоже, нет вывода краткого текста из соответствующих постов. Ну и второй недостаток — отсутствие плагина на официальном сайте wordpress (не понятно будет он поддерживаться в дальнейшем или нет).
Данный плагин тоже имеет большое число хороших опций — отображение миниатюр не только в постах, но и на страницах + пользовательских типах записей, возможность разных настроек оформления (цвета фона, рамки, длина текстов описания и т.п.). Также в модуле есть возможность выбрать критерий, по которому будет определять схожесть материалов — по тегам и/или категориям, случайным образом или задаваться вручную. Можно указать источник миниатюр. Скачиваем плагин Related Posts Thumbnails .
Плюсы:
много настроек отображения + выбор способа определения похожих постов.
Самый большой недостаток:
вывод изображений в виде больших горизонтальных полос, что иногда может смотреться очень стильно, но в большинстве случаев не очень хорошо.
В данном wordpress модуле опций по настройке меньше чем в предыдущих, но это не вызывает никаких проблем. Здесь вы сможете выбрать разные размеры миниатюр, а также их количество для отображения. Отличной функцией есть специальный эффект с отображением анонса поста при наведении на картинки. Кроме того, похоже, что плагин может выбирать изображения из картинок, которые имеются в посте, а не только брать их из «featured image». Да и автоматический ресайз картинок работает хорошо. Скачиваем отсюда .
Плюсы:
Отлично справляется с ресайзом (изменением размера) картинок и хороший эффект при наведении.
Недостатки:
Не очень много опций по оформлению.
Плагин WP-Thumbie позволяет контролировать число миниатюр, их размер, длину текста анонса (или отключать его), а также исключать страницы из списка или категории. Скачать модуль можно .
Приятные опции:
можно включать/отключать анонсы постов, хорошо работает изменение размера изображений.
Недостатки:
Нет так много опций по настройке внешнего вида, но вроде бы все основные моменты имеются.
Собственно, модуль выполняет именно те функции, которые заявлены в названии — выводит . Иногда бывают ситуации, когда как раз нужно максимально простое решение.
Плюсы:
простота, отличный ресайз картинок.
Минусы:
Мало опций в настройке, нет анонсов постов. Не смотря на то, что в плагине имеется не только горизонтальный, но и вертикальный вариант отображения, в последнем не показывают миниатюры.
Итого
После изучения всех 5 плагинов для похожих постов с миниатюрами и рассмотрение их функциональности получилась следующая таблица. Оценивались параметры: умение хорошо ресайзить картинки, отображение анонсов, горизонтальный и вертикальный вариант списка, настройки оформления.
Есть ли здесь победитель? Автор статьи решил выбрать в качестве него модуль Wp-Thumbie. Во-первых, он хорошо ресайзит миниатюры — сразу понятно что за картинка перед вами, во-вторых, имеет базовый набор необходимых опций. С другой стороны, здесь нет горизонтального стиля отображения и анонсов, поэтому я бы, наверное, все же рекомендовал выбрать модуль исходя из ваших задач . Кроме того, я также настоятельно советую глянуть один из прошлых постов про , который имеет множество настроек и достаточно функциональный, если говорить о миниатюрах. В целом все модули достаточно неплохие более-менее одинаковые.
P.S. Интернет продажи могут стать очень выгодным, чтобы создать интернет магазин лучше обратиться в профессиональную веб-студию вашего города.
Хотите сэкономить при покупке или заказе услуг? — используйте купоны на скидки, с помощью которых можно очень выгодно и отдыхать.
Доброго дня! Мы уже не раз говорили о том, насколько важно проводить внутреннюю оптимизацию на сайте. Один из способов сделать эффективную внутреннюю перелинковку – вывод похожих записей внизу каждой статьи. Такое дополнение позволяет увеличить длительность пребывания посетителей на сайте, уменьшает показатель отказов, а соответственно положительно сказывается на . О том, как добавить похожие записи на WordPress-блог, какие плагины для этого подойдут, а также о том, как это сделать без плагинов пойдет речь в сегодняшней статье.
Есть два варианта вывода похожих записей под статьей – по категориям и по тегам (меткам). Теги позволяют показывать схожие по тематике статьи, которые могут относиться к разным разделам. За вывод статьи отвечает файл single.php. Если кто забыл, можно ознакомиться со статьей про .
Т.е. чтобы добавить похожие записи без плагина к статье, нам нужно вставлять код непосредственно в single.php.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | Читайте также ID ) ; if ($categories ) { $category_ids = array () ; foreach ($categories as $individual_category ) $category_ids = $individual_category -> term_id ; $args = array ( "category__in" => $category_ids , "post__not_in" => array ($post -> ID ) , "showposts" => 3 , "orderby" => rand , "caller_get_posts" => 1 ) ; $my_query = new wp_query($args ) ; if ( $my_query -> have_posts () ) { echo "
|
Читайте также
ID); if ($categories) { $category_ids = array(); foreach($categories as $individual_category) $category_ids = $individual_category->term_id; $args=array("category__in" => $category_ids, "post__not_in" => array($post->ID), "showposts"=>3, "orderby"=>rand, "caller_get_posts"=>1); $my_query = new wp_query($args); if($my_query->have_posts()) { echo "- ";
while ($my_query->have_posts()) {
$my_query->the_post();
?>
Приведенный код нужно вставлять сразу после вывода статьи в файле single.php.
Но это еще не все. Если вы хотите, чтоб по ссылкам похожих записей переходили, вам придется дополнительно их оформить. Для этого нужно внести изменения в файл стилей style.css.
Чтобы получилось, как на данном , добавьте следующий код:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | #related_posts { margin-right : -25px ; } #related_posts p{ font-size : 18px ; } #related_posts li{ float : left ; width : 205px ; margin : 0 20px 20px 0 ; padding : 4px ; background : #f8f8f8 ; /* цвет фона серый*/ height : 160px ; } #related_posts li: hover { background : #f6fffd ; /* смена фона на голубой при наведении */ } #related_posts li a{ text-align : center ; display : block ; padding : 5px ; color : #222 ; /* цвет ссылок */ } #related_posts li img{ width : 195px ; height : 117px ; } |
#related_posts{ margin-right: -25px; } #related_posts p{ font-size: 18px; } #related_posts li{ float: left; width: 205px; margin: 0 20px 20px 0; padding: 4px; background: #f8f8f8; /* цвет фона серый*/ height: 160px; } #related_posts li:hover{ background: #f6fffd; /* смена фона на голубой при наведении */ } #related_posts li a{ text-align: center; display: block; padding: 5px; color: #222; /* цвет ссылок */ } #related_posts li img{ width: 195px; height: 117px; }
Внося изменения в код, вы можете выводить записи с миниатюрами различного оформления и стиля.
Если вы отдаете предпочтение плагинам, то вот несколько из них для выводапохожих записей: WordPress Related Posts, Simple Tags, Similar Posts или Yet another related posts.
Наиболее популярный WordPressRelatedPosts анализирует содержание статьи и подбирает соответствующие ей посты с вашего блога. Преимуществом данного плагина похожих записей перед остальными является то, что он наиболее легкий, т.е. меньше других нагружает сервер. Читайте « ». В настройках WordPressRelatedPosts так же, как и с помощью кода, но без лишних трудов, можете указать количество выводимых записей, принцип сортировки (по дате, случайный, по популярности). Также вы можете выводить посредством плагина в Вордпресс похожие записи с миниатюрами (Thumbnail), но для этого для ваших статей на сайте должны быть предварительно созданы эти миниатюры.
Выбирайте свой способ, чтоб выводить похожие записи в WordPress:плагин или код. Главное, чтоб выбранный метод соответствовал вашим ожиданиям и привлекал все больше посетителей на сайт.
Одной из замечательных особенностей WordPress является система плагинов. Плагины WordPress решают практически любые задачи, которые только можно представить - начиная с расширения простого блога до мощной информационной системы и заканчивая добавлением различных инструментов и оптимизацией блога для нужд SEO. Возможности не имеют ограничений (к тому же надо еще прибавить использование различных тем).
Но использование большого количества плагинов повышает риск "зависания" вашего сайта под управлением WordPress. Есть множество плагинов, которые несовместимы друг с другом или существенно снижают скорость работы вашего сайта.
В данном уроке мы рассмотрим как работать с похожими записями в блоге без плагинов.
Почему следует отказаться от использования плагина?
Есть множество причин по которым следует предпочитать использование встроенного кода и функций WordPress плагинам.
Во-первых, вам не нужно будет полагаться на третью сторону (разработчика плагина) для сохранения функционирования вашего блога. Довольно часто популярные плагины остаются без поддержки своими разработчиками, и большое количество владельцев сайтов оказываются связанными с устаревшим и потенциально опасным чужим кодом.
Другая причина заключается в том, что вы избегаете риска использовать код плагина, который может "завесить" или замедлить работу сайта (хотя такие случае достаточно редко встречаются при использовании плагинов из официального каталога WordPress).
Данная функция разработана для использования на странице основной статьи (файл single.php ), но вы можете применять код там, где нужно в цикле WordPress. Для выбора похожих записей используются метки, которые проставляются для статей.
Миниатюры
У WordPress есть встроенная система для работы с миниатюрами, которая нам понадобится. Для ее использования нужно добавить данный код в файл functions.php вашей темы (в больинстве случаев такой код уже имеется в наличии).
Add_theme_support("post-thumbnails");
Также можно установить высоту и ширину миниатюры с помощью добавления следующей строки кода рядом с предыдущей:
Set_post_thumbnail_size(100, 50, true);
Важно: при добавлении изображения в запись, чтобы создать миниатюру, на панели загрузки изображения надо нажать кнопку "Использовать как миниатюру".
Код
Код добавляется в файл single.php :
Код the_post_thumbnail(array(150,100) устанавливает размер миниатюры, которая будет выводиться (в нашем случае 150px х 100px).
CSS
У нас используется два класса здесь: “.relatedposts ”, который используется для контейнера, и “.relatedthumb ”, который применяется к миниатюрам и ссылке, размещенным в контейнере. Предполагается, что ширина блока записи 640px. Код CSS:
Relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;} .relatedposts h3 {font-size: 20px; margin: 0 0 5px 0; } .relatedthumb {margin: 0 1px 0 1px; float: left; } .relatedthumb img {margin: 0 0 3px 0; padding: 0;} .relatedthumb a {color:#333; text-decoration: none; display:block; padding: 4px; width: 150px;} .relatedthumb a:hover {background-color: #ddd; color: #000;}
Выше приведенный код CSS выводит миниатюры записей шириной 150px. То есть, мы получаем 4 миниатюры на ширине записи 640px (включая поля между ними). Если нужно другое количество, то придется сделать настройки: например, если хочется разместить 5 миниатюр, то нужно установить ширину в классе .relatedthumb примерно 125px.
Важно: Ширина миниатюр, генерируемая установками медиа файлов WordPress, должна соответствовать значениям, используемым в CSS. Также нужно соответствие со значениями, установленными в коде PHP: the_post_thumbnail(array(150,100) .
Пример
Блог DigitalBattle использует описанный метод для формирования списка подобных записей:
Блок с похожими записями можно оформить как угодно. Например, очень популярен заголовок "Вам также может понравиться".
Заключение
WordPress имеет множество встроенных функций, которые во многих случаях позволяют отказаться от использования плагинов от сторонних разработчиков. Всегда следует провести поиск на предмет альтернативных решений без плагинов. Вы будете удивлены тем, как много может WordPress.