مطالب مرتبط همراه عکس

مطالب مرتبط همراه عکس

یکی از راه های هدایت کاربران به قسمت های مورد علاقه شان این است که وقتی وارد ادامه مطلب یک پست میشوند مطالب مرتبط را ببینند و بر روی آنها کلیک نمایند . اما در برخی از سایت ها نمایش عکس برای مطالب مرتبط خیلی مهم است . مانند سایت های گالری عکس و یا کلیپ و …
امروز میخواهیم با چند حرکت ساده , آموزش دهیم این امکان را با چند حرکت ساده انجام دهید…

برای انجام این کار در جای مناسب در فایل single.php کد زیر را قرار دهید .

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<?php
$tags = wp_get_post_tags($post->ID);
if ($tags) {
  $first_tag = $tags[0]->term_id;
  $args=array(
    'tag__in' => array($first_tag),
    'post__not_in' => array($post->ID),
    'showposts'=>5,
    'caller_get_posts'=>1
   );
 
  $rel_posts = new WP_Query($args);
  if( $rel_posts->have_posts() ) {
    while ($rel_posts->have_posts()) : $rel_posts->the_post(); ?>
 
<div class="rel_posts">
<div class="rel_thumb"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_post_thumbnail(array(130,130)); ?></a></div>
<div class="rel_link"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></div>
</div>
<?php
endwhile;
}
}
?>
 
<div class="clearer"></div>

تعداد نمایش مطالب را به وسیله
(‘showposts’=>۵,)
میتوانید تنظیم کنید و سایز مطالب را میتوان با

1
(<?php the_post_thumbnail(array(130,130)); ?>)

ویرایش کرد

برای نمایش بهتر لطفا کد های زیر را در فایل style.css قالب خود قرار دهید :

1
2
3
4
5
.rel_posts {float:left; margin: 15px 15px 15px 0;}
.rel_thumb {margin:10px 0 10px 0;}
.rel_thumb img {border:1px solid #aaa;}
.rel_link {text-align:center; color: #555;}
.clearer {clear:both;}

در صورتی که قالب شما از thumbnail پشتیبانی نمیکند کد زیر را به functions.php قالب خود بیفزایید :

1
2
<?php if ( function_exists( 'add_theme_support' ) )
add_theme_support( 'post-thumbnails' ); ?>

یک پاسخ بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *