Вывод похожих записей для WordPress, без использования плагина

Главная » Wordpress » Вывод похожих записей для WordPress, без использования плагина
Самолетная 614022 Россия, Пермь +79630195620
Wordpress
новичкам, плагины
5273

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

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

Какая задача стоит перед нами?

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

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

похожие записи на wordpress

О том как их делать, я не так давно писал в посте — несколько миниатюр на wordpress блоге. Поэтому дальнейшее решение в виде кода, будет основываться на этих принципах.

Плагин Multiple Post Thumbnails, без него никуда не деться

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

Вот так примерно будет выглядеть это в админке.

похожие записи на wordpress

Этот скрин сделан в момент редактирования записи — как уменьшить показатель отказов на сайте.

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

Наш волшебный код

Теперь открываем файл single.php который отвечает за отображение поста. И там вставляем следующий код:

Размещайте его перед comments_template () которая отвечает за вывод комментариев. Тем самым вы похожие записи выведите перед комментариями. Хотя если у вас там имеются и другие блоки с информацией, как например у меня, то можете установить этот код перед ними.

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

Меняйте число на то количество постов которое хотите видеть.

Теперь давайте поговорим вот об этом куске кода:

Зачем здесь 3 раза повторение одного и того же? Дело в том, что во время публикации поста, может быть несколько меток, и основная метка у которой уже есть посты, может с первого места сдвинуться на второе. Например: была метка «Новинки» — в ней есть несколько записей. И когда вы публикуете новый пост, вы по кроме метки «Новинка», вы добавляете метку «Акции». В результате получается что первой стоит «Акция», а потом «Новинка», если бы не было верхнего кода, то на странице мы бы не увидели похожих записей. В общем данный код позволяет находить записи у 3 указанных меток. Я обычно больше трех меток не указываю.

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

Ну и немного CSS для украшений наших похожих постов.

 

Черкни и ты пару строк

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

Подписка на блог MASALKIN.NAME
Не упусти шанс получить отличные бонусы!

100% конфидециальность, адреса электронной почты не разглашаются и не предоставляются третьим лицам для коммерческого или некоммерческого использования.

Благодарность читателям

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

P.S. Не забудь подписаться на блог, тебя ждет много интересного и полезного!

Удачи!

  • Айк

    А не лучше вместо этого плагина скачать плагин, который будет выводить похожие посты))?

    • Масалкин Андрей

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

      Да и времени на самом деле занимает 5 минут максимум, чтобы все это сделать:)

      • Айк

        Ясно))

        К стати вы когда то написали что используйте больше 15 плагинов. Это очень много не так ли? У меня тоже обычный статейный сайт, и использую там 5-6 плагинов всего лишь.

        • Масалкин Андрей

          Сейчас уже 18:) Но 5 из них поставлены для оптимизации скорости работы блога. Те кеш, оптимизация бд и тд. Часть плагинов это SEO плагины. Из тяжелых только Произвольные поля, форма контактов, подсветка кода, и плагин посика. Остальное незначительные мелочи (типа типографа, русских дат и тд)

          • Айк

            Ваш блог грузиться довольно быстро. К стати какой тариф хостинга бегет вы взяли?

          • Масалкин Андрей

            Когда начинал, брал Start. Его вполне хватает на 2-3 сайта. Блог у меня на VPS стоит. На бегите сейчас 3 сайта крутятся.

          • Айк

            Понятно. Я то думал что подсветка кода, форма контактов, форма поиска самые мелкие и легкие плагины))

  • Ух сколько тут кода.

    Попробую поставить, Спасибо Андрей)

    • Масалкин Андрей

      Не а что:) Там скопировать да, да вставить:))

      • У каждого шаблона свои причуды)

      • Вячеслав

        Здравствуйте Андрей, подскажите почему я не могу «скопипастить» код (с окошка подсветки кода) с вашего сайта. Не выделяет, не копирует, пробовал хромом и оперой.

        • Масалкин Андрей

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

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

          • Вячеслав

            Ну просто текст копируется нормально. У меня не выделяется из окошка подветка кода

          • Вячеслав

            В консоли браузера вот такие ошибки:

            Failed to load resource: net::ERR_CONNECTION_REFUSED

            main.js:1 Uncaught ReferenceError: jQuery is not defined

            wppb_animate.js:1 Uncaught ReferenceError: jQuery is not defined

            masalkin.name/:67 Uncaught ReferenceError: $ is not defined

            jquery.form.min.js:11 Uncaught TypeError: e is not a function

            scripts.js:445 Uncaught ReferenceError: jQuery is not defined

            front.min.js:1 Uncaught ReferenceError: jQuery is not defined

            mini.share42.js:1 Uncaught ReferenceError: jQuery is not defined

            crayon.min.js:1 Uncaught ReferenceError: jQuery is not defined

            jquery.fancybox-1.3.7.min.js:43 Uncaught ReferenceError: jQuery is not defined

            jquery.easing.pack.js:14 Uncaught ReferenceError: jQuery is not defined

            jquery.mousewheel.min.js:8 Uncaught ReferenceError: jQuery is not defined

            masalkin.name/:1367 Uncaught ReferenceError: jQuery is not defined

            ajax.googleapis.com/ajax/...js?1450372266480 Failed to load resource: net::ERR_CONNECTION_REFUSED

            (program):1 Uncaught ReferenceError: jQuery is not defined

          • Вячеслав

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

            У меня была аналогичная проблема с AJAX на сайте CMS Joomla. Решил проблему локальной установкой Jquery в Joomla.

          • Масалкин Андрей

            Да скорее всего проблема в этом. У меня библиотека jquery подключается на блоге через google. А они скорее всего блокируют Крым.

            Попробуйте вновь что-нибудь скопировать, поменял подключение jquery с гугла на яндекс, будут ли проблемы?

            Просто не хочу чтобы у кого-то возникали еще проблемы.

          • Вячеслав

            Да, проблема устранена.

  • Я пока пользуюсь плагином. Надо будет попробовать вывести вторую миниатюру как у вас. А то сейчас 4 темно-синих пятна под каждой статьей :)

    • Масалкин Андрей

      Попробуй конечно. Ничего сложного нет в этом:) Как говорится: «Глаза бояться, а руки делают!»

      • Вячеслав

        Все сделал как в статье, в админке добавляется вторая картинка, но почему то ничего не выводиться ничего вообще :(

        В чем может быть проблема?

        • Масалкин Андрей

          Вячеслав а ко всем статьям добавили изображения? Вы попробуйте просто, сделайте задайте к 5-6 статьям изображения, которые принадлежат одному тегу. И посмотрите, выводятся или нет.

          • Вячеслав

            Все везде добавил, еще перепроверил. 6 Записей с одинаковым тегом, и ничего не возводится.

          • Масалкин Андрей

            Прямо мистика какая-то :)

            Через обратную связь пришлите URL сайта, посмотрю, может увижу в чем проблема может быть.

          • Вячеслав

            Отправил через форму «Есть вопросы»

x

Ваше имя (обязательно)

Ваш e-mail (обязательно)

Сообщение