wordpress调用文章缩略图的例子(不用插件)

时间：2014-04-22 编辑：简简单单来源：一聚教程网

本节就带大家一起来玩玩这个游戏。

在首页需要显示的地方插入下面的这段代码：

代码如下

复制代码

/”,$content)): ?>

    ”>
    ” title=”” src=”catch_that_image()?>” width=”102″ height=”110″>

代码详解：

posts_per_page=18：表示调用18篇文章；

orderby=rand：表示随机显示文章；

代码如下	复制代码
：

这是调用function.php中的一个图片函数，该函数在下一节我们将讲到。

好了，这样，我们就给首页添加了随机展示的图片集代码。要实现图片的展示，我们还需要在function.php中添加调用文章图片的函数。这个我们在下一节中我们会讲到。

再附一方法

第一步：找到使用的主题模板的functions.php文件在之间添加如下代码

代码如下	复制代码
function thumb_img($soContent){ $soImages = ‘~]* />~’; preg_match_all( $soImages, $soContent, $thePics ); $allPics = count($thePics[0]); if( $allPics > 0 ){ echo “”; echo $thePics[0][0]; echo ‘’; } else { echo “”; echo “ echo bloginfo(‘template_url’); echo “/images/thumb.gif’>”; } }

这是一个显示缩略图的方法，自动检索文章的第一张图片，如果没有显示当前主题/images/thumb.gif 所以你要把这个thumb.gif图片准备好。

第二步：找到index.php文件即首页文件，找到the_content();或相似的代码在它之前添加如下代码：

代码如下	复制代码
thumb_img($post->post_content);

这样就调用了刚才的方法，实际上缩略图已经完成了。但是你看到的效果一定很意外，应为图片的大小没有控制，会很难看。好了，第三步

第三步：添加缩略图样式CSS代码：

这是浮云站使用的的缩略图样式，你可以先凑合着用，再另行修改

代码如下	复制代码
#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}

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