Похожие записи с картинками wordpress без плагина


Похожие записи с картинками wordpress без плагина

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

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

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

Видеоурок: Похожие записи с картинками wordpress без плагина

Необходимые данныеДля открытия - нажмите

1. Вставляем функцию

Достаточно открыть файл single.php (можно через меню Внешний вид -> Редактор) и вставить один из кодов на выбор в том месте, где хотите видеть список связанных записей.

Данный код работает на основе подбора постов по совпадающим меткам(тегам).

‘showposts’=>4, — отвечает за количество выводимых постов

Если же нужно сделать подбор похожих записей по рубрикам, надо заменить следующую строчку кода:

на этот код:

 

2. Редактирование CSS

Добавляем в список стилей style.css следующий код:

Также, по-желанию эти списки можно как угодно оформлять, добавлять любые стили, миниатюры или анонсы на статьи.

 

3. Плагины «Похожие записи»

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

WordPress related posts – Один из лучших плагинов, позволяющий осуществить настройки с нужной Вам функциональность. К тому же весит он очень мало, что означает и минимальную нагрузку на сервер.

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

Simple Tags — Плагин для создания облака меток и связанных записей. Автоматически проставляет метки для записи и управляет ими.

Плагин Simple Tags одно из множества функций, является создание внутренней перелинковки страниц блога. То есть в конце каждого поста можно вставить список похожих записей. Он предлагает посетителям вашего сайта посмотреть также другие ваши посты.

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


Понравился пост, подпишись на обновления

Понравилась статья? Получай свежие статьи первым по e-mail

[newsletter_signup_form id=0]

100 раз(а) написали о “Похожие записи с картинками wordpress без плагина

  1. Хм, надо бы призадуматься насчёт выводов в конце статей… интересная мысль

    Ответить
  2. Поставить такой блок обязательно нужно.
    1. Человек найдет больше полезной информации по теме, которая его заинтересовала.
    2. А для владельца плюс в том, что улучшается ПФ(поведенческий фактор)

    Ответить
  3. Я уже установила такой блок себе на блог, люди стали задерживаться дольше на блоге, и это очень радует))
    В общем экспериментируйте!)

    Ответить
  4. Добрый день, Игорь! Сделал все как Вы показываете в уроке, но после обновления файлов на хостинге, сайт выдает ошибку 500. Не подскажите в чем дело?

    Ответить
    • Скорей всего Вы вставляете код не правильном месте кода.

      Ответить
  5. Добрый день ! Что-то сбилось у меня потому, что блоки стали лесенкой и внутри ничего нет, а очень хочется !

    Ответить
    • Возможно вам надо править css стили под свой дизайн.
      А вы в постах используете миниатюры к постам?

      Ответить
  6. Миниатюры используются. Так если бы знать чего и на что править в CSS

    Ответить
    • Если Вы, Виталий плохо разбираетесь в CSS, то проще установить один из плагинов для вывода похожих новостей.

      Ответить
  7. Здравствуйте Игорь!
    Я вот на Денвере сейчас блог тестирую и по инструкции вставил код на страницу. Но вместо того что бы отображать похожие страницы, у меня отображается почти весь код. Что не так, где косяк?

    Ответить
    • Дмитрий, от куда я могу знать почему у вас кося? Как видно в видеоуроке все работает, также этот же блок представлен у нас на сайте. Внимательно смотрите инструкцию.

      Ответить
  8. Поставил код и в месте где должны виводиться похожие посты пишет:

    Ответить
    • Не ужели для вставки кода трудно воспользоваться кнопкой «код» на панели.

      Проверил код в посте, он рабочий. Следуйте инструкции и смотрите внимательнее видеоурок.

      Ответить
      • Так и сделал не работает, куда бы код не ставил видает ошибку, возможно не на всех версиях wordpress работает? имеет ли значение язык админ-панели?

        Ответить
        • Работает на последних версиях wordpress 3.x

          имеет ли значение язык админ-панели?

          Не совсем понял причем тут язык и какой язык админ-панели?

          Ответить
          • У меня WordPress Украинский 3.2.1 все делаю как написано не работает.

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

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

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

      Ответить
      • Все у вас работает! Код вставил после кода вашей подписки. Только, что бы все у вас было гуд еще надо править CSS под дизайн.

        Ответить
  10. а где взять код который вставляется так шустро ?

    Ответить
    • Не понял что вы имеете ввиду, но весь код находится под видео.

      Ответить
  11. Статья — супер. Очень полезно для своего сайта. А так же очень привлекательно смотрится. Огромное спасибо Игорю за помощь в установке и настройке этой функции.

    Ответить
  12. Напишите, пожалуйста, как сделать вывод миниатюр. Спасибо

    Ответить
    • В файле index.php и в других файлах, где вы хотите вывести миниатюру вставляйте в нужном месте код

      Ответить
  13. Все работает, но картинки не отображаются. В чем может быть проблема? WP самый свежий.

    Ответить
    • Для отображение картинок в постах должны использоваться миниатюры, с ними все работает.

      Ответить
  14. Всё работает.
    Одно «но»: миниатюры не обрезаются, если они велики. Если бы можно было чётко указать размер изображения..

    Ответить
    • Все хорошо работает а как сделать чтобы выводились последние записи из определенной категории….

      Ответить
      • к примеру я буду выводить код не в single.php а допустим в index.php и где то в уголке выводятся последние записи к примеру категории новости…

        Ответить
        • Все разобрался!!! хороший код универсальный..

          Ответить
          • Рад, что вы смогли разобраться. Ведь об выводе из категорий написано в посте.

            Ответить
    • Allpa, у меня была та же проблема. Я заменила этот кусок кода

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

      Ответить
      • А можете привести этот код пожалуйста?

        Ответить
        • Если вы про изменение размера миниатюры, то есть такой мануал:

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

          Ответить
  15. Хорошая статья. У меня вопрос. ПО умолчанию выводятся новости из категории и периодически проскакивает ссылка «сама на себя». Можно ли исключить страницу на которой в данный момент выводятся похожие статьи из рандома?

    Ответить
    • Что-то странное у вас творится. Так как в этот код исключает из выдачи ID просматриваемого поста. Даже не знаю с чем это может у вас быть связано.

      Ответить
  16. Спасибо за понятный код для вывода похожих записей с картинками. Работает отлично. Плагины ставить не очень хотелось, а рабочий код найти не легко. К счастью код нашелся на Вашем сайте.

    Ответить
  17. Добрый вечер. А не подскажите в чем может быть проблема. У меня записи выводятся не прямо, а лесенкой.
    Заранее спасибо.

    Ответить
    • Добрый день. Вам дописать в css стиль #related_posts ul строчку list-style:none; в итоге должно получится:

      Ответить
  18. Спасибо огромное!!! Все получилось!

    Ответить
  19. Автор няшка, спасибо большое за статью и видео! В очередной раз понял, что нужно доучить php:)

    Ответить
  20. Очень понравилось ваше отображение комментариев, хочу такиеже не подскажите как реализовать ???

    Ответить
    • Как? верстать и постоянно улучшать свой блог. Какого-то решения типа установить плагин — НЕТ. Подписывайтесь и следите за обновлениями, со временем на этом блоге появится много интересных плюшек.

      Ответить
  21. Игорь спасибо, применил у себя на сайте, весьма доволен результатом.
    Правда пришлось повозиться с отображением картинок, по примеру the_post_thumbnail( array(100,100) ); // Другое разрешение не помогло только с пустым полем, но там размер не устраивал, пришлось повозиться, решение нашлось простое. В файл functions.php прописал add_image_size (‘post-preview’, 110, 110, true); а в single.php в коде прописать так the_post_thumbnail(‘post-preview’);. и все заработало, можно прописать любые размеры.

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

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

        Ответить
  22. Доброго времени суток!
    Такой вопрос, а можно ли вместо заданной миниатюры использовать первое изображение поста?
    И как это можно реализовать?
    п.с.
    постов сильно много и задавать им всем миниатюры сильно хлопотно для меня.
    на сайте все изображения 100*100 и 200*115
    Заранее спасибо!

    Ответить
    • За вывод миниатюры отвечает это переменная

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

      Ответить
      • Спасибо я уже с этим вопросом разобрался!
        Так же сделал авто подгон размера выводимой миниатюры из первого изображения
        и авто обрезку названия поста по количеству слов
        иначе блоки один больше другой меньше не очень красиво выглядит
        Есть еще пару воросов:
        1 Есть всем известный плагин WP-PostRatings, как бы сделать вывод постов одной рубрики по самому высокому рейтингу?
        2 И как сделать фильтр к данному скрипту только по дате т.е. вывод самых новых постов из всех рубрик от самого нового к более поздним?
        Заранее спасибо!

        Ответить
  23. Спасибо за статью! Поставил и настроил все отлично работает).
    Хотелось что бы отображалась дата похожих статей. функция the_date() не выводит содержимое. Подскажите пожалуйста как решить эту проблему?

    Ответить
    • Все должно выводится, пропишите так:

      Ответить
  24. Есть проблема! Если тег только один на сайте то похожие посты не выводятся, просто пустое пространство, никто не знает как решить данную проблему? Буду благодарен если отпшитесь

    Ответить
  25. Добавил ваш код и перестал отображаться сайтбар, а похожие записи так и не появились. Убрал стили сайт отобразился нормально, но без похожих записей.

    Ответить
    • Стили делались под шаблон который идет в дистрибутиве, вам скорей всего надо делать свои стили.

      Ответить
  26. Добрый день уважаемый! Твой код для похожих записей самый лучший который я вообще находил! 90% найденных вообще не работают — но не об этом сейчас! Я вот установил код — выводятся блоки отлично, четко, но не могу сделать так, чтобы миниатюры выводились тоже. Если поможешь буду очень признателен! Уже стал подписчиком блога))))

    Ответить
  27. Спасибо очень красиво смотрица на сайте, вот только есть один нюанс как вывести в 5 записей в одной строке?

    На данный момент если поставить ‘showposts’=>5

    Будет 4 в одну строку и 1 снизу.

    Ответить
    • Меняйте размер картинки(читайте комментарии) и правьте css.

      Ответить
  28. Как сделать отступ текста от картинки?

    Ответить
  29. Добрый день.
    Отличное дополнение к посту. Спасибо автору за статью, очень грамотно расписано.

    Реализовал на своём сайте и очень доволен, но встала новая задача. Хочется сделать вывод похожих статей в 3 строки. Не могу понять как это реализовать.

    Я вместо тегов поставил загнал вывод в таблицу, но получается только большая колбаса, когда увеличиваю к примеру ‘showposts’=>10.

    Или же выходит огромная колонка с одинарными постами в самый низ из этих 10 showposts. Подскажите как вывести посты в 3 строки или же хотя бы в 2…

    Спасибо.

    Ответить
    • Андрей,вывод блока с новостями надо размещать в div, а не в таблицах. Регулировать ширину блока через css и новости должны сместится друг под друга в 2 или 3 строки.

      Ответить
  30. Спасибо за статью. Сейчас попробую сделать «Похожие записи» у себя на сайте.

    Ответить
  31. Спасибо Игорь отличная статья.
    Игорь а что за плагин у вас стоит который так код красиво выводит в постах?

    Ответить
    • Алексей, для вывода кода в постах использую плагин Crayon Syntax Highlighter

      Ответить
  32. здраствуйте подскажите пожалуйста установил всё как написанно в статье но кроме заголовка и рамок больше не чего не отображается в чём может быть причина

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

    Ответить
    • Как вариант можно придумать одну картинку заглушку и вставлять ее к новостям где нет картинок.

      Ответить
  34. Прикольно было бы еще скопировать этот код! Из видео вроде как не скопируешь! Или его ручками предлагаетет писать!?)

    Ответить
    • Для особо одаренных, что бы не писать ручками под видео есть вкладка «Необходимые данные» 🙂

      Ответить
  35. Спасибо за статью! Значительно снизилось время загрузки страниц, у меня стояли виджеты с сервиса get.2leep.com и ооочень долго страница грузилась
    Еще раз спасибо!

    Ответить
  36. Можно ли этот код как то использовать в sidebar, т.е виджет?

    Чтобы отображался только в single

    Ответить
  37. Есть ли какой-то вариант, если используется два кода для вывода пох.записей, один выводится снизу статьи а второй в сайд-баре как виджет.

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

    Подскажите как это можно сделать?

    Ответить
    • В sidebar я не пробовал выводить, поэтому не могу Вам подсказать.

      Ответить
  38. Поставил в sidebar, отлично смотрится!
    Только в нужно задать размеры миниатюры!

    Ответить
  39. Спасибо, давно хотела сделать похожие записи картинками. Радует, что это можно сделать без плагина, чтобы не заваливать сервер окончательно.

    Ответить
  40. Спасибо за хороший вариант, попробовал… но годится только для «дубовой» перелинковки без притязаний на реальный факт похожести статей. Для индексации хорошо, но не для пользователя.

    Лучше это делать плагином Yet Another Related Posts Plugin, ибо подобный плагин необходим. Если и грузит базу, то хоть знаешь, чего ради: его алгоритм анализирует не только назначенные мною тэги, но и релевантность содержания статей запросу, что для посетителя важно. То есть «Похожие статьи» (статьи по теме) на самом деле будут соответствовать заявленному.

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

    Ответить
  41. Спасибо. Все отлично работает

    Ответить
  42. Перелинковку и похожие посты на сайте без плагина могут сделать лишь те, кто «дружит» с кодом движка. Остальным, увы, приходится использовать различные плагины, которые, ктати тоже требуют настройки. Мне пришлось перебрать несколько плагинов, пока не остановилась на Related Post Thumbnails.

    Ответить
  43. К сожалению, процент совпадения тематичности выводимых таким образом похожих записей очень низок. Вылезает все подряд, под одинаковым меткам или опубликованное в одной категории. Я для этих целей использовал «Yet Another Related Posts Plugin», слегка обработав его напильником под свои стили.

    Ответить
  44. Спасибо, очень толковый пост без воды. К сожалению, похожие записи с картинками wordpress без плагина не смогла вывести. Картинка почему-то появилась только в верхней похожей записи, да и та в полном размере. Пришлось оставить плагин Yet Another Related Posts Plugin. Но и там ни все картинки выходят. Чтобы картинки появились должны быть заданы миниатюры?

    Ответить
    • В моем случае миниатюры обязательны.

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

    Ответить
    • Скорей всего Вам надо настраивать CSS стили вашего шаблона.

      Ответить
  46. А вы не могли бы подсказать, что именно может отвичать за такую странную функцию?

    Ответить
    • Странная Вы, Юля. Как я Вам скажу если Вы даже не указываете про какой сайт идет речь, а вообще http://studio-gost.ru/cena-html/ Доработка сайта от 300руб.

      Ответить
  47. Игорь, доброго времени суток! Хочу поблагодарить за предоставленную качественную информацию. Сделал всё как написано в статье, немного подкорректировав. Похожие статьи выводятся прекрасно. До этого стоял плагин, но было всё криво и не эффектно.

    Ответить
  48. Я себе поставил выводить в конце поста по категориям и по меткам — это удобно, но не знаю насчет нагрузки на сервер, как бы тормозить не начал при посещаемости 3к+

    Ответить
  49. Подскажите, пожалуйста, а как выводить похожие записи не во всех категориях (без использования плагинов)?
    Вот у меня есть категории «статьи 1», «статьи 2», «специалисты».
    Как сделать так, чтобы «похожие записи» выводились во всех категориях «статьи…» и НЕ выводились в категории «специалисты»?
    Спасибо!

    Ответить
    • С данным вопросом я не разбирался.

      Ответить
  50. Старый, но полезный код. мучает один вопрос: какую добавку в код вывода «похожих записей без плагина» нужно сделать, чтобы сортировка выполнялась по всем меткам, КРОМЕ одной, для определенности кроме метки с ID=100?

    Ответить
  51. Добрый день!
    Подскажите как быть. Мне нужно вывести случайную запись лишь в 1 посте, а не во всех. Как это сделать?

    Ответить
  52. Долго я пользовался этим способом, но в конечном итоге, переехал сначала на Related Posts Thumbnails, а сейчас использую YARPP. Подбор по теме точнее, настройки проще, а главное кеширование.

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

    Ответить
    • а главное кеширование.

      Насколько я знаю в бесплатной версии нет кэширования.

      Ответить
  53. Есть возможность вывода наиболее посещаемых постов?
    Для некоторых категорий работает, а в некоторых выводит посты из всех категорий.

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

    Ответить

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

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