Как вывести ссылки на предыдущий и следующий посты с миниатюрами

Как вывести ссылки на предыдущий и следующий посты с миниатюрами | n-wp.ru
Код, выводящий миниатюру предыдущего/следующего поста. Такая миниатюра будет отлично смотреться рядом со ссылкой на предыдущий/следующий пост в конце записи.
👍 Научим бесплатно правильно создавать сайты на WordPress. Подробнее →

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

Как вывести ссылки на предыдущий и следующий посты с миниатюрами

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

ID); ?> <!-- запрос, возвращающий миниатюру, прикрепленную к предыдущему посту --> 
                                             <!-- вывод ссылки-картинки (миниатюра предыдущего поста) -->
                                                             <!-- вывод ссылки на предыдущий пост (название поста) -->

В том месте, где нужно вывести ссылку на следующий пост с миниатюрой, используйте этот код:

ID); ?>     <!-- запрос, возвращающий миниатюру, прикрепленную к следующему посту -->
                                                 <!-- вывод ссылки-картинки (миниатюра следующего поста) -->
                                                                 <!-- вывод ссылки на следующий пост (название поста) -->

Вам осталось только добавить оформление к этим ссылкам.

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

Создай свой первый сайт на WordPress

tiaurus

Автор n-wp.ru — блога о WordPress для новичков.

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

  1. antonator

    А как можно динамически изменять размеры этих миниатюры? Они у меня все разных размеров, но в навигации «предыдущая/следующая» хотелось бы отображать их, и одинаковыми, и уменьшенными.

    Ответить
    1. tiaurus автор

      Заключить миниатюру в DIV, и прописать для этого элемента стиль в style.css.

      single.php:

      <div class="previous_post_link_thumb">
          <?php previous_post_link('%link', $prevthumbnail); ?>
      </div>
      

      style.css:

      div.previous_post_link_thumb {display:inline-block;}
      div.previous_post_link_thumb img {width:200px !important; height:auto !important;}
      
      Ответить
      1. antonator

        Нда… Слона-то я…
        Спасибо, буду делать.

        Ответить
  2. Antay

    Tiaurus У вас замечательный блог! Скажите на нескольких сайтах, в том числе и у вас видел такую замечательный элемент дизайнерской периленковки как выпадающие по бокам ссылки на предыдущую и следующую статью. На простых темах каким образом можно реализовать данную функцию. То есть чтобы ссылки на предыдущий и следующий пост находились именно сбоку в центральной части окна бразуера и раскрывались при наведении на одну из них. Что нужно прописывать в single.php в этом случае? Или этот код и вводим что вы написали в данной статье? Большое спасибо!

    Ответить
    1. tiaurus автор

      Посмотрите плагин Floating NextPrev — он сделает то, что вам нужно.

      Ответить
  3. Дмитрий Егоров

    Из кода остались только комментарии

    Ответить
×
WordPress:
прокачай свой сайт!

Скидка на премиум темы и плагины

Успей забрать скидку ⋙