加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > CMS系统 > wordpress > 正文

给WordPress相关文章显示缩略图

发布时间:2020-12-14 14:29:10 所属栏目:wordpress 来源:网络整理
导读:由站长 通过网络收集整理的代码片段。编程之家小编现在分享给大家,也给大家做个参考。 为了增加用户体验和阅读深度,很多朋友喜欢为自己的博客添加相关文章功能,有些是纯文字的,而有些则是带缩略图的,今天这里我就简单说下带缩略图的相

以下代码由PHP站长网 52php.cn收集自互联网现在PHP站长网小编把它分享给大家,仅供参考

为了增加用户体验和阅读深度,很多朋友喜欢为自己的博客添加相关文章功能,有些是纯文字的,而有些则是带缩略图的,今天这里我就简单说下带缩略图的相关文章的实现方法。


将以下代码加入 single.php 文件中想要显示带缩略图的相关文章处:

<div id=”related-posts”>

<div class=”caption”>带缩略图的相关文章:</div>

<div class=”related” class=”clearfix”>

<ul>

<?php

$post_num = 5; // 设定数量.

$exclude_id = $post->ID; // 單獨使用要開此行

$posttags = get_the_tags(); $i = 0;

if ( $posttags ) {

$tags = ”; foreach ( $posttags as $tag ) $tags .= $tag->term_id . ‘,’;

$args = array(

‘post_status’ => ‘publish’,

‘tag__in’ => explode(‘,’,$tags),// 只選 tags 的文章.

‘post__not_in’ => explode(‘,$exclude_id),// 排除已出現過的文章.

‘caller_get_posts’ => 1,

‘orderby’ => ‘comment_date’,// 依評論日期排序.

‘posts_per_page’ => $post_num,

);

query_posts($args);

while( have_posts() ) { the_post();

?>

<li><a href=”<?php echo the_permalink(); ?>” title=”<?php the_title(); ?>” ><img src=”<?php if ( get_post_meta($post->ID,‘thumbnail1’,true) ) { echo get_post_meta($post->ID,true);}

elseif ( has_post_thumbnail() ){$thumbnail1_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID),‘thumbnail1’);echo $thumbnail1_url[0];}else{echo catch_first_image();} ?>” alt=”<?php the_title(); ?>” width=”120″ height=”120″ ></a>

<a href=”<?php echo the_permalink(); ?>” ><?php the_title(); ?></a></li>

<?php

$exclude_id .= ‘,’ . $post->ID; $i ++;

} wp_reset_query();

}

if ( $i < $post_num ) { // 如果 tags 文章數量不足,再取 category 補足.

$cats = ”; foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ‘,’;

$args = array(

‘category__in’ => explode(‘,$cats),// 只選 category 的文章.

‘post__not_in’ => explode(‘,

‘caller_get_posts’ => 1,

‘posts_per_page’ => $post_num – $i,‘thumbnail1’);echo $thumbnail1_url[0];}else{echo catch_first_image();} ?>” alt=”<?php the_title(); ?>” width=”120″ height=”120″ ></a>

<a href=”<?php echo the_permalink(); ?>” ><?php the_title(); ?></a></li>

<?php

$i++;

} wp_reset_query();

}

if ( $i == 0 ) echo ‘<li>没有相关文章!</li>’;

?>

</ul>

</div>

</div>

<!– release post end –>

根据自己博客样式修改一下 CSS 代码:

/** related post thumbnail **/

#related-posts{border-radius:5px;border-top:3px #dfdfdf solid;background:#fff;clear:both;}

.caption{color:#0C0C0B;font-size: 14px;font-weight:bold;padding-top: 10px;margin-bottom: 10px;margin-left:10px;}

.related {white-space:normal;margin:0 auto;overflow: hidden;border-left: 1px solid #DFDFDF;margin-left:20px;}

.related li{float: left;width: 120px;height:180px;list-style:none;border-right:1px solid #dfdfdf;padding:4px;_padding:2px;text-align: left;}

.related a{float: left;width: 126px;text-overflow: ellipsis;-o-text-overflow: ellipsis;}

.related a:hover{white-space: normal;}

.related li:hover{background:#F6F6F6;}

.related img{height:120px;width:120px;border:0;padding:0;}

也可以把上面第一步中的 php 函数代码放在单独一个文件中,如 likeposts.php,然后在想要调用的页面添加调用代码:

<?php include(‘includes/likeposts.php’);?>

以上内容由PHP站长网【52php.cn】收集整理供大家参考研究如果以上内容对您有帮助,欢迎收藏、点赞、推荐、分享。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读