wordpress调用文章缩略图的例子 - WordPress

wordpress调用文章缩略图的例子

看过时美网的朋友,应该看到首面的图片集和侧边的图片展示,对整个页面美观的贡献是非常大的,美中不足的是,它是通过图片插件来实现的,那么,怎样不通过插件来实现缩略图的调用呢？

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

<div  class =]slideshow-2″>      <ul>      <?php query_posts(‘posts_per_page=18&caller_get_posts=1&orderby=rand’); ?>      <?php  while  (have_posts()) : the_post(); ?>      <?php  $content = $post ->post_content;  if (preg_match([/<img.*>/], $content )): ?>      <li>      <a target=]_blank] href=]<?php the_permalink(); ?>]>      <img atl=]<?php the_title(); ?>] title=]<?php the_title(); ?>] src=]<?php  echo  catch_that_image()?>] width=]102″ height=]110″>      </a>      </li>      <?php  endif ;  endwhile ; ?>      </ul>      </div> 

代码详解:

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

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

调用的代码如下:<?php echo catch_that_image()?>： 

这是调用function.php中的一个图片函数,好了,这样,我们就给首页添加了随机展示的图片集代码.

再附一方法

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

function  thumb_img( $soContent ){      $soImages  = ‘~<img [^>]* />~’;     preg_match_all(  $soImages ,  $soContent ,  $thePics  );      $allPics  =  count ( $thePics [0]);      if (  $allPics  > 0 ){      echo  [<span id=’thumb’>];      echo   $thePics [0][0];      echo  ‘</span>’;     }      else  {      echo  [<span id=’thumb’>];      echo  [<img src=’];      echo  bloginfo(‘template_url’);      echo  [/images/thumb.gif’></span>];     }     } 

这是一个显示缩略图的方法,自动检索文章的第一张图片,如果没有显示当前主题/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 } 

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

查看更多关于wordpress调用文章缩略图的例子 - WordPress的详细内容...