Случайни публикации с умалени изображения в WordPress сайдбара без плъгини

1 авг. 2019 | Без плъгини
Случайни публикации с умалени изображения в WordPress сайдбара без плъгини

Показването на произволни публикации в WordPress дава на нашите читатели шанс да открият повече от съдържанието на сайта ни. По подразбиране WordPress може да показва в сайдбара последните публикации, подредени хронологично. Потребителите виждат само най-новите статии, и то без умалените изображения към тях (thumbnails). Така постепенно старите ни публикации потъват в забрава, особено ако сайтът ни е от доста време.

Един от начините за преодоляване на това е чрез поставяне на линкове вътре в новите ни публикации, сочещи към по-стари такива. Така също биха се увеличили показванията на страниците ни и да се подобри оптимизацията за търсещи машини (SEO).

Друг начин за това е чрез показване на произволни публикации в страничната ни лента (sidebar). Ще ги извикаме естествено без да използваме плъгини, само с малко код, който ще добавим във файла functions.php на WordPress темата ни.

Този код просто създава функция, която показва 5 произволни публикации (можем да променяме броя по наше желание) – заглавието, картинката към статията и датата на публикуване. След това създава и кратък код (shortcode), с който лесно можем да извикаме произволните публикации навсякъде в нашия сайт, дори и в страничната лента – просто поставяме шорткода [wp-random-posts] в публикация, страница или текстова джаджа в WordPress.

function wp_rand_posts() {
$args = array(
'post_type' => 'post',
'orderby' => 'rand',
'posts_per_page' => 5,
);
$the_query = new WP_Query( $args );
if ( $the_query->have_posts() ) {
$string .= '<div id="random-posts-widget-with-thumbnails" class="random-posts-widget"><ul>';
while ( $the_query->have_posts() ) {
$the_query->the_post();
$string .= '<li><a href="'. get_permalink() .'">'. get_the_post_thumbnail($post->ID) . '' . get_the_title() .'</a><div class="random-posts-widget-post-date"> '. get_the_date($post->ID) .'</div></li>';
}
$string .= '</ul></div>';
wp_reset_postdata();
} else {
$string .= 'no posts found';
}
return $string;
}
add_shortcode('wp-random-posts','wp_rand_posts');
add_filter('widget_text', 'do_shortcode');

Все пак, ако държим да извикаме най-новите си статии, а не случайни, просто премахваме от кода реда ‘orderby’ => ‘rand’ и готово.

След това трябва да си зададем и стил за показваните публикации. Ето един примерен код с респонсив дизайн (responsive design), който изглежда като на картинката.

.random-posts-widget ul{list-style:outside none none;margin-left:0;margin-right:0;padding-left:0;padding-right:0}
.random-posts-widget ul li{overflow:hidden;margin:0 0 1.1em}
.random-posts-widget ul li img{display:inline;float:left;margin:.2em .5em .5em 0}
#random-posts-widget-with-thumbnails img{max-width:130px;width:100%;height:auto}
.random-posts-widget-post-date{font-size:11px;font-size:.79rem;color:#777;line-height:2;padding:3px 0 0 10px}