студия занимательная МИХАЛИКА
! Михалика - запросто с WordPress:
доступная ручная работа по правилам оптимального интернет(а)
Здравствуйте !

издатель:   в теме: HTML-CSS-PHP
студия занимательная МИХАЛИКА

Как на сайте сделать вывод похожих по теме рубрики записей блога — с миниатюрами

Что ж, продолжим статью добавления ссылок на похожие записи… но уже прикрепим к ним миниатюры изображений. Всё настраиваемо и адаптивно!

Оптимизация, о которой речь, нынче очень полезна, и в плане перелинковки, и относительно удобств посетителю и админом. Посудите: в нынешнем адаптивном «длинном» дизайне шаблонов, вывод ссылок похожих записей СЕГОДНЯШНИМ СПОСОБОМ правильный подход — в отличие размещения в сайдбаре, ибо посетитель редко достигает низа — ведь виджеты расположены ближе к подвалу, если смотреть сайт с телефона или планшета.


…а посему нужно как можно полезнее использовать основное статейное место сайта.

 

 

 

настраиваем похожие по теме записи и миниатюры

 

 

 

Рекомендую вернуться к статье, ссылка на которую выше, так будет понятнее.

 

Открываем файл post-single.php у вас может быть и иной, к примеру просто single.php

 

 

Отыщите в этом файле кусочек кода, по которому нужно ориентироваться, вписывая «похожие записи» в тело статьи — the_content('') — этот вензель (функция) отвечает за вывод всей массы статьи.

Если вам нужно выводить ссылки на другие посты рубрики вверху страницы, то код, который ниже, нужно прописывать перед показанной формулировкой, а вот если в финале, то — после неё (подробнее в предыдущей статье).

 

 

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

 

 

А вот и нужный код вывода в записи тематически-похожих записей (пояснения работы кода чуть ниже):

 

 

<div class="sample-posty">
<p>ещё статьи по теме:</p>
<?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(
'category__in' => $category_ids,
'post__not_in' => array($post->ID),
'showposts'=>5,
'orderby'=>rand,
'caller_get_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><a href="<?php the_permalink() ?>" rel="bookmark" target="_blank" title="<?php the_title(); ?>">
<?php the_post_thumbnail(); ?><br /><?php the_title(); ?></a></li>
<?php
}
echo '</ul>';
}
wp_reset_query();
}
?>
</div>

 

 

Прописывайте его (не разрывая другие процессы иных функций файла post-single.php

…сохраняйте и смотрите что получилось на сайте… Файл стилей пока не трогаем.

 

 

Обратите внимание на див класс <div class=″sample-posty″>, который образует селектор CSS .sample-posty — если вы уже пробовали способ вывода аналогичных статей рубрики БЕЗ картинок, то удалите или закомментируйте относящийся к нему селектор.

Файл стилей style.css не нужно бессмысленно загружать.

 

 

Также возможен способ перемены имени показанного кода css ниже. Например sample-posty замените на sample-posty2 или как-то иначе…

 

 

Собственно вот код CSS, относящийся к сегодняшний теме.

 

 

/*похожие записи*/
.sample-posty p{
font-weight: 700;
color: #878787;
font-size: 16px;
margin: 5px 0;
font-style: italic;
}
.samp {
font-weight: 700;
color: #878787;
}
.sample-posty li{
float: left;
width: 110px;
margin: 0;
padding: 0;
background: #f8f8f8;
}
/*li:hover{}*/
.sample-posty li a{
text-align: center;
/*display: block;*/
padding: 5px;
}
.sample-posty li img{
width: 95px; /*ширина картинки*/
height: 67px; /*высота картинки*/
}

 

 

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

 

 

 

 

А вот к первому коду вывода интересных записей по теме, дам пояснения К НАСТРОЙКАМ ОТОБРАЖЕНИЯ ССЫЛОК НА НУЖНЫЕ АДРЕСА СТАТЕЙ.

 

 

Вот строка: ‘category__in’ => $category_ids, — если её заменить такой — ‘tag__in’ => $tag_ids,
то сортировка близких по духу статей будет отрабатываться по тегам.
Настроек ради, обратите внимание на строку ‘orderby’=>rand,
родимая  отвечает за случайный (рандомный) порядок выборки ссылок на записки. Но коли вам нужно, чтобы записи  показывались согласно датам их создания — просто уберите эту фразу.
Далее ‘caller_get_posts’=>1 — запрещает повторение одноимённых статей.
Cтрока ‘showposts’=>3 — цифра, есть количество выводимых ссылочек на похожие темы.

 

 

 

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

 

 

Думается, на этой высокой ноте настроек настроения можно и закончить на сегодня.

 

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

 

 


На этом занавес представления опускается…

 


подписка feedburner МИГ подписки - ВРЕМЯ знаний!!

 

 

 


Если что-то не ясно, спрашивайте. Помогу… в чём дюжу.
Вместе мы многое сможем! Берегите себя и свой век - mihalica.ru


Нажатия на кнопочки определяют Ваше высокое гражданское сознание
Удачи в работе и творчестве..!


меточная навигация:


Комментарии © 0 к статье: Как на сайте сделать вывод похожих по теме рубрики записей блога — с миниатюрами

Поделитесь соображениями: Ваши мысли очень важны! $ правила комментирования ©

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