Похожие записи WordPress: с плагином, без плагина, с миниатюрами

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

Похожие записи Вордпресс – это элемент внутренней перелинковки. Применять ее надо обязательно. Она поможет увеличить количество просмотров и время нахождения посетителей на блоге.

Роботы тоже используют эти линки для ускорения индексирования страниц.

Плагины

Начинающие авторы обычно ставят плагины. Плюс данного способа: установить, настроить плагин просто.

Они отличаются способом вывода ссылок, сортируют: по похожим названиям, по посещаемости, по ключевым словам.

Перечень записей формируется в виде списка простого или с миниатюрами. Размер картинок можно настроить.

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

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

СТАТЬИ ПО ТЕМЕ:

.Htaccess: настройка, установка файла

Как сделать, изменить wordpress главную страницу

Html выделить текст цветом (фон), рамкой

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

Related Posts for WordPress

Он выводит список в конце поста или в виджете, поддерживает миниатюры, содержит несколько настроек внешнего вида. Related Posts for WordPress

Кеширует похожие посты, нет необходимости каждый раз генерить их заново.

Jetpack

Похожие записи это часть многофункционального плагина Все seo в одном. Устанавливать его только с целью создания связанных постов нерационально.

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

Similar Posts

Чтобы снизить влияние на сервер, используется кеширование блока схожих постов.

Особенности этого расширения:

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

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

Custom Related Posts

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

Без плагина

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

В этом случае надо лишь продуманно проставлять метки, чтобы они были максимально релевантны содержанию. Количество ссылок в списке можно изменять.

Вывод по меткам

Исправления будем вносить в файл single.php (одна запись).

Выше строчки <?php comments_template (); ?>  вставляем код

<div class="sample-postsinca">
<ul>
<?php
//for use in the loop, list 5 post titles related to first tag 
on current post
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$first_tag = $tags[0]->term_id;
$args=array(
'tag__in' => array($first_tag),
'post__not_in' => array($post->ID),
'showposts'=>5,
'caller_get_posts'=>1
);
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post(); ?>
<li><a href="<?php the_permalink() ?>" 
rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<?php the_title(); ?></a></li>
<?php
endwhile;
}
wp_reset_query();
}
?>
</ul>
</div>

'showposts'=>5 это количество ссылок, которое вы выводите.

Чтобы связанные посты соответствовали стилю вашего блога, в файл style.css (вниз) вставьте код

.sample-postsinca ul li{
background-position:left center;
background-repeat:no-repeat;
list-style-type:none;
margin-bottom:10px;
padding-left:20px;
}

Ну, вот и получились (смотрите в конце страницы) похожие записи без плагина.

Еще интереснее, когда к каждому посту привязана привлекательная картинка (миниатюра). У посетителей появляется дополнительная мотивация перейти по ссылке из этого блока на другие страницы.

Вывод похожих записей без плагина с миниатюрами

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

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

<div id="related_posts">
<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(
 'tag__in' => $tag_ids,  //сортировка по тегам (меткам)
 'post__not_in' => array($post->ID),
 'showposts'=>3,  //количество выводимых ячеек
 'orderby'=>'rand', // в случайном порядке
 'ignore_sticky_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><div class="cell"><a onclick="return !window.open(this.href)" 
href="<?php the_permalink() ?>"><?php the_post_thumbnail('thumbnail'); ?>
</a><br>
<a onclick="return !window.open(this.href)" 
href="<?php the_permalink() ?>" rel="bookmark" 
title="<?php the_title(); ?>"><?php the_title(); ?></a></div></li>
<?php
}
echo '</ul>';
}
wp_reset_query();
}
?>

'showposts'=>4 количество ячеек в ряду

В файле style.css пропишите стили для идентификаторов id="related_posts" (вид блока) и class="cell"(вид ячеек).

#related_posts{
margin: 10px 0;   /*  Отступы от верхнего и нижнего края */
float: left;     /* Прижимаем блок к левому краю */
 width: 100%;  /* Длина блока соответствует ширине страницы */
}
#related_posts ul {
 margin-left: 5px;  /*  Внешний отступ от левого края страницы */
 width: 577px;  /* Общая ширина блока без учета отступов от краев 
страницы */
}
#related_posts li {
 list-style: none;  /* Отменяем нумерацию списка (1,2,3 и т.д.) */
}
.cell{
height: 225px;  /* Высота ячейки  */
box-shadow: #F5F5F5 0px 2px 3px, #F5F5F5 0 0 3px inset;  /* Тень 
для ячеек (необязательно) */
float: left;   /* Каждая следующая ячейка располагается слева */
list-style: none;  /* Отменяем родительские стили */
margin: 5px;  /* Расстояние между ячейками */
padding: 2px;  /* Отступы от миниатюры до края ячейки */
text-align: center; /* Текстовые заголовки расположены по центру */
width: 157px;  /* ширина одной ячейки */
overflow: hidden;  /* Окончания длинных заголовков, 
не вместившихся в ячейку, будут скрыты */
border: #F5F5F5 solid 1px; /* Рамка вокруг ячейки */
border-top-left-radius: 10px;  /* Закругление левого верхнего угла 
ячейки */
border-top-right-radius: 10px;  /* Закругление правого верхнего угла 
ячейки */
border-bottom-left-radius: 10px;  /* Закругление нижнего левого угла 
ячейки */
 border-bottom-right-radius: 10px;  /*Закругление нижнего правого угла 
ячейки */
}
.cell a:hover {
color: #C6C600;  /* Цвет ссылки при наведении курсора */
text-decoration:none; /* Убираем подчеркивание ссылки */
}
.cell a{
color: #000000; /* Цвет ссылки */
text-decoration:none; /* Убираем подчеркивание ссылки */
}
#related_posts li :hover{
 background-color: #f9f9f9; /* Цвет фона ячейки при наведении курсора */
}
/* Стили для мобильных устройств */
@media screen and (max-width:760px){
#related_posts{
width:auto;
display:block;
position:relative;
}
#related_posts ul {
width:auto;
}
#related_posts li {
float:left;
}
}

Миниатюры будут ссылками, статья, соответствующая картинке,
откроется в новом окне.

Вывод похожих записей с миниатюрами из пропорционально уменьшенных картинок поста плюс анонсы

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

1 ЭТАП. Дополнительно изображения загружать не надо. В файл functions.php добавьте следующий код.

function catch_that_image() {
  global $post, $posts;
  $first_img = '';
  ob_start();
  ob_end_clean();
  $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', 
$post->post_content, $matches);
  $first_img = $matches [1] [0];
  if(empty($first_img)) {
    $first_img = "http://ваш_сайт/files/default.jpg"; // Ссылка 
на заглушку
  }
  return $first_img;
}

В строке $first_img = "http://ваш_сайт//files/default.jpg"; // Ссылка на заглушку укажите адрес картинки на вашем сайте, которая будет выводиться при отсутствии похожих записей.

2 ЭТАП. В файл single.php перед <?php comments_template (); ?> внесите код

<table border="0" cellspacing="10"><tbody><tr>
<td valign="top" align="right" width="110"><div>Похожие записи</div></td>

    <?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'=> 3, // Количество выводимых записей
         'caller_get_posts'=> 1
      );
     $rp_query = new wp_query($args);
     endif;
     if($rp_query):
      if($rp_query->have_posts()) ?>
        <?php while ($rp_query->have_posts()):  $rp_query->the_post(); ?>

         <td valign="top"><div style="padding-left:8px;">
           <a href="<?php the_permalink() ?>" 
title="<?php the_title_attribute(); ?>">
           <a href="<?php the_permalink() ?>" 
title="<?php the_title(); ?>">
            <img align="left" style="-webkit-box-shadow:0 0 10px 
rgba(0, 0, 0, 0.4); 
-moz-box-shadow:0 0px 10px rgba(0, 0, 0, 0.4); 
margin: 2px 10px 2px 0px; 
display: inline" 
src="<?php echo catch_that_image() ?>" 
alt="<?php the_title(); ?>" width="250"/>
           </a>
           <a href="<?php the_permalink() ?>" 
title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a>
           <br /><?php the_content_rss('', TRUE, '', 24); ?>
         </div></td>

        <?php endwhile; ?>
     <?php else: ?>
       <td><?php _e("Похожих записей пока нет",""); ?></td>
     <?php endif; wp_reset_query(); ?>

</tr><tbody></table>

КОЛИЧЕСТВО выводимых записей 'showposts'=> 3

МАКСИМАЛЬНАЯ ширина картинок " width="250", минимальная 110 мм

РАССТОЯНИЕ между ячейками (cellspacing="10") 10 мм (можно уменьшить если картинок больше и они более мелкие)

<?php echo catch_that_image() ?> - это ФУНКЦИЯ вывода изображения из записи, которую мы вставили на 1 этапе в functions.php.

<?php the_title(); ?> - ВЫВОД названия записи

<?php the_content_rss('', TRUE, '', 24); ?> - АНОНС записи без форматирования. 24 - количество отображаемых слов.

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

Заключение

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

В статье использованы материалы:

seo-mayak.com/sozdanie-bloga/obxodimsya-bez-plaginov/kak-vyvesti-poxozhie-zapisi-s-miniatyurami-na-wordpress-bez-plagina.html;

n-wp.ru/4490

Понравилась статья? Поделиться с друзьями:
Я новичок
Комментариев: 26
  1. подать бесплатное объявление на gigplanet.ru

    Ух ты, мне понравилось!

  2. Юнна Разумова

    Ольга, спасибо за статью! Сегодня подписчиков набирать трудно, так как рассылок много, а с другой стороны — все больше людей обращаются к такой форме получения информации, это стало нормой.

    Поэтому, если рассылка качественная, то она непременно найдет своего читателя. Но Ольга права — про конверсию забывать не стоит!

    1. Ольга (автор)

      Юнна, набрать трудно, но можно. И надо облегчить посетителям задачу — формы подписки поместить на видном месте, сделать их более заметными. Например, установить над формой мигающую стрелку.
      А также использовать завлекалки, к примеру, всплывающее окно. Увы, но без этого не обойтись.

  3. Евгений

    Пост понравился, пишите еще. Я с удовольствием прочту

  4. Ольга

    Ольга, я попробовала размещать блок подписки к каждой статье, но оказалось, что это очень сильно нагружает сайт, видимо плагин «тяжелый». Стал очень медленно грузиться.
    Видимо, мне нужно исправлять ошибки, которые «утяжелили» мой сайт еще до установки плагина и только потом попробовать опять. Как Вы считаете?

    1. Ольга (автор)

      Ольга, конечно, плагины замедляют сайт. Поэтому если есть альтернатива замены плагина установкой кода в шаблоне, сделайте.
      Я тоже внесла изменения в код, поставила там подписку Фидбернер (обновления блога).
      Теперь вот думаю, как заменить ее на Смартреспондер (это эначительно эффективнее).

      Вы же можете вставлять форму вручную после каждой статьи.

      1. Ольга

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

      2. Ольга (автор)

        Ольга, проверьте свой блог на сервисе PageSpeed developers. google.com/speed/pagespeed/insights/?hl=RU.
        Вам напишут, что именно у вас долго грузится и что надо оптимизировать.

  5. Евгения

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

    1. Ольга (автор)

      Евгения, очень интересно. Почитала статью об этом у Вас на блоге.
      У меня стоит плагин Thank Me Later, который отправляет спасибо за комментарий, мою ссылку и предложение подписаться на новые статьи на эл.почту комментатора.

  6. Вера

    Мне понравился совет о размещении формы подписки в конце статьи. Поэкспериментирую. Свой информационный материал пока не создаю, не успеваю. Разве, что к новому снегу соберусь.

    1. Ольга (автор)

      Главное — форму поставить и бесплатность приготовить.
      Подписчики лишними не бывают.
      Пока материал для рассылки готовите, к тому времени небольшая база появится.

  7. Ольга

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

    1. Ольга (автор)

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

      1. Николай

        По поводу «бесплатностей» согласен.
        Предлагаю платный вариант на этом примере:
        http: // kupitlt.ru/result2

      2. Aleks

        а вы пробовали или нет?

      3. Ольга (автор)

        Aleks, можно использовать платные способы набора подписчиков: Яндекс.Директ или рекламу в чужих рассылках, а также разнообразные скрипты. Более подробно прочитайте https://moi-start.ru/reklama-v-chuzhoj-rassylke.html/ и https://moi-start.ru/kak-nabrat-bazu-podpischikov-platnymi-sposobami.html/.

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

  8. Aleks

    А есть еще какие нибудь эффективные способы набора подписчиков?
    а то как то у меня не получается их набрать!

  9. Лариса

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

  10. Лариса

    Спасибо за статью. Очень актуально, доступно и понятно.

  11. Сергей

    Спасибо

  12. Дмитрий

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

    1. Ольга (автор)

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

  13. Dolya

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

  14. Роман

    E-mail рассылки, наверное, самый надежный способ привлечения клиентов. А главное, что в итоге обходиться дешевле других способов. Я бы рекомендовал

  15. Александр

    Очень хорошо всегда работали, да и сейчас работают кнопки социальных сетей.

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: