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

издатель:   в теме: Контент - кодингS  реплики: будьте первым в диалоге
 
Запросто с WordPress - студия занимательная МИХАЛИКА

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

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

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

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


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

 

 

 

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

 

 

 

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

 

Открываем файл 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 и их значений сегодня не стану, ибо в прошлых статьях уже много говорили.

 

 

 

 

А вот к php коду вывода интересных записей по теме дам пояснения…

 

 

 

Вот строка: ‘category__in’ => $category_ids, — если её заменить такой — ‘tag__in’ => $tag_ids,

то сортировка близких по духу статей будет отрабатываться по тегам.

 

Настроек ради, обратите внимание на строку ‘orderby’=>rand,

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

 

Далее ‘caller_get_posts’=>1 — запрещает повторение одноимённых статей.

 

Cтрока ‘showposts’=>3 — цифра, есть количество выводимых ссылочек на похожие темы.

 

 

 

Таким образом, регулируя вышепоказанные настройки, вы сможете добиться оптимального результата своим требованиям отображения похожих записок блога — в финале поста, или же перед его стартом (где-то в информационном описании статьи) — как оформить статью тегами h3 — h4-5

 

 

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

 

 

А коли не ясно, всегда можно спросить в комментариях…

 

 

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

Очень рекомендую! да и способ более продвинутый!!

 


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

 


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

 

 

 


Благодарности)) и вопросы в комментариях - помогу… в чём дюжу
А также Вы можете просто:
Нажатия на кнопочки определяют Ваше высокое гражданское сознание
ещё статьи по теме:

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


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

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

Внимание! Обязательные поля помечены *

Яндекс.Метрика