找了半天都没有找到适合的模板,PHP也还不是很熟悉,
一看主题本身就带有这个功能,只不过是在文章末尾调用了“相关文章”
不过代码完全不同,上网搜了个遍终于折腾出一个合适的 —— 调用指定分类ID的,代码如下(经过JV修改)
<div class="post-related-home"> <ul> <?php $args=array ( 'cat' => 6, // 分类ID 'posts_per_page' => 4, // 显示篇数 ); query_posts($args); while( have_posts() ) { the_post(); echo '<li><a href="'.get_permalink().'" style="display:block; margin-bottom:-30px;">'; dm_the_thumbnail(); echo '</a>'; echo '<a href="'.get_permalink().'" style="opacity:0.7;margin-left:5px;background-color:#111;color:#ccc;height:20px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis">'; echo get_the_title().'</a>'; echo '</li>'; $postid .= ',' . $post->ID; }; wp_reset_query(); ?> </ul> </div>
以上代码中也有加样式,因为在下面的CSS中没办法修改,无奈JV的代码知识半桶水啊。
一共要改三个地方:
一、先将以上代码 保存为 post-related-home.php ,放在主题的inc文件夹下;
二、当然就是调用这个php了,在主题 home.php 内的 <div class="content"> 下面使用语句 <?php include('inc/post-related-home.php'); ?> 来调用;
三、修改CSS ,class名字换了,得重新加个选择器 ,
/* post-related-home */ .post-related-home{overflow:hidden;margin-bottom:16px;border-bottom:1px solid #bbb;padding-bottom:10px;} .post-related-home ul{width:100%;position: relative;} .post-related-home li{float:left;width:25%;line-height:15px;color:#999;overflow:hidden;} .post-related-home a{width:160px;display: inline-block;} .post-related-home a img{width:170px;height:120px;display:block;border: solid 1px #ccc;padding: 2px;box-shadow: 0px 1px 1px #EEE;margin-bottom: 5px;} .post-related-home a:hover img{border-color:#bbb;border-bottom-color:#aaa;opacity:0.9;}
本站文章除注明转载/出处外,均为本站原创或翻译。若要转载但请务必注明出处,尊重他人劳动成果。
转载请注明出处链接 : https://www.inlojv.com/1369.html