在几个月之前， Kayo 曾经写过一篇文章介绍如何在 WordPress 中做一个“相关文章”栏目，最后我折腾了一个仿无觅样式的栏目，因为之前一直有为每一篇文章配上特色图片，因此该栏目会读取文章的特色图片作为栏目内容。昨天经一位童鞋提醒能不能弄成读取文章内容中的图片显示出来，突然觉得这个想法也不错，毕竟不是每一篇文章都能配上一幅适合的特色图片，于是折腾了一会，便有了以下的代码，因为原理在之前大致相同，这里就不在详细叙述了，如果有问题欢迎童鞋们及时指正！
<h3><?php _e('You may also like'); ?></h3>
<ul class="same_cat_posts_ul">
<?php
foreach(get_the_category() as $category){
$cat = $category->cat_ID;
}
query_posts('cat=' . $cat . '&orderby=rand&showposts=5'); //控制相关文章排序为随机，显示5篇相关文章
while (have_posts()) : the_post();
$imgContent = $post->post_content;
$imgser = '~<img [^\>]*\ />~'; // 搜索所有符合的图片
preg_match_all( $imgser, $imgContent, $aimgs );
$imgnum = count($aimgs[0]); // 检查一下至少有一张图片
?>
<li>
<?php if ( $imgnum > 0 ) { ?>
<a class="same_cat_posts_img" href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php echo $aimgs[0][1];//如果没有启用jQuery图片延时加载就改为[0][0] ?></a>
<? } else { ?>
<a class="same_cat_posts_img" href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><img src="<?php bloginfo('template_url'); ?>/images/wordpress_default.jpg" alt="<?php the_title(); ?>" ></a>
<? } ?>
<h3 class="same_cat_posts_tittle"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
</li>
<?php endwhile; wp_reset_query(); ?>
</ul>
</div>
首先还是需要准备一幅图片作为当文章没有特色图片时显示的默认图片，并把该图放到主题文件夹里的 images 文件夹，这次我使用的是旅游拍摄时的图片（点我下载），当然你也可以使用自定义的图片，只要修改图片名或功能代码中相应的文件名即可。
本文由 Kayo Lee 发表，本文链接：https://kayosite.com/imitate-wumi-related-articles-two.html
评论列表
发现个问题了。
H3上那个是
吧
我使用使用原码表示出错了。后正常。 :evil:
@Demon 不明白噢！你的评论里面是不是有html？WP会将一些html自动忽略了，要不你去掉”<",">“再评论试试。
话说我昨晚刚换了新的评论邮件通知样式，Demon有没有收到新样式的邮件？
@Kayo QQ或是邮件有木有。或是你邮件M我 下。我跟你说一下。
@Demon 嗯，邮件M你！
这效果挺牛X的
@分享元素 哈哈，努力折腾的产品！喜欢就好~
把代码放进去了以下，结果发现不好用。1、没有横排；2、有图貌似也调用不出来。
@huiris 代码直接调用不一定就生效，要根据自己的情况修改一下，毕竟每个主题不一样吧！
1.没有横排可能是你的父元素的宽度比这个相关文章div的宽度小。
2.代码默认设计给使用了图片延时加载的主题，如果图片调用不出来可以修改一下，代码里有注释了！
@Kayo 好的，先看看代码
@Kayo 对了，是配合你这个代码的第一篇文章里的CSS一起使用吧。
@huiris 嗯，是的，谢谢提醒，我都忘了在文中提示一下！
不想用插件,但有時候技術問題，又不得不用插件解決了事~坑爹~
@我們30歲 其实折腾多点就会了，毕竟原生的才不会浪费多余的资源！
最满意的相关日志代码，朋友年轻有为！
@萨龙龙 自己折腾之作，喜欢就好
请问，博主用timthumb 剪裁的图片是如何做到静态化的？
@CYs 我没有做静态化，直接使用 timthumb 剪裁，不过 timthumb 是有缓存的，如果是流量问题就不用担心，如果是想复用剪裁的图片 timthumb 应该就不适合了！