无插件-WordPress简单三步实现首页文章显示缩略图

教程大全 2026-01-08 17:47:29 浏览

WordPress简单三步实现首页文章显示缩略图 喜欢折腾修改Wordpress主题的朋友,肯定遇到过这样的问题,想在首页文章中显示缩略图,有插件可以实现,不过不方便操作和控制,毕竟代码是人家写的,今天与大家分享一下,无插件,纯代码是怎么实现首页文章缩略图的,方法非常简单,就算你不懂代码,按步骤操作也是可以的。当然缩略图选择的是文章中的第一张图片,如果文章不包含图片,显示默认图片,所以你要置顶一个默认的图片位置。 步入正题,开始添加首页缩略图,分简单3步即可实现: 第一步: 找到使用的主题模板的functions.php文件在之间添加如下代码

复制代码

代码如下:

function thumb_img($soContent){$soImages = '~无插件WordPress简单三步实现首页文章显示缩略]*\ loading="lazy" alt="无插件WordPress简单三步实现首页文章显示缩略">~';preg_match_all( $soImages, $soContent, $thePics );$allPics = count($thePics[0]);if( $allPics alt="无插件WordPress简单三步实现首页文章显示缩略"> 0 ){echo "";echo $thePics[0][0];echo '';}else {echo "";echo "无插件WordPress简单三步实现首页文章显示缩略";}}

这是一个显示缩略图的方法,自动检索文章的第一张图片,如果没有显示当前主题/images/thumb.gif 所以你要把这个thumb.gif图片准备好~ 第二步: 找到index.php文件即首页文件,找到the_content();或相似的代码在它之前添加如下代码:

复制代码

代码如下:

thumb_img($post->post_content);

这样就调用了刚才的方法,实际上缩略图已经完成了!但是你看到的效果一定很意外,应为图片的大小没有控制,会很难看…好了,第三步 第三步: 这是浮云站使用的的缩略图样式,你可以先凑合着用,再另行修改

复制代码

代码如下:

#thumb{margin:5px 15px 5px 5px;width:145px;height:120px;border:3px solid #eee;float:left;overflow:hidden;}#thumb img{max-height:186px;max-width:186px}

好了,这样缩略图就有模有样的显示出来啦!三步搞定!

本文版权声明本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,请联系本站客服,一经查实,本站将立刻删除。

发表评论

热门推荐