wordpress调用文章缩略图的例子
发布:smiling 来源: PHP粉丝网 添加日期:2014-06-21 10:28:52 浏览: 评论:0
看过时美网的朋友,应该看到首面的图片集和侧边的图片展示,对整个页面美观的贡献是非常大的,美中不足的是,它是通过图片插件来实现的,那么,怎样不通过插件来实现缩略图的调用呢?
在首页需要显示的地方插入下面的这段代码:
- <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}
好了,这样缩略图就有模有样的显示出来啦,三步搞定.
Tags: wordpress文章缩略图
相关文章
- ·wordpress自动调用文章缩略图的方法总结(2014-06-21)
推荐文章
热门文章
最新评论文章
- 写给考虑创业的年轻程序员(10)
- PHP新手上路(一)(7)
- 惹恼程序员的十件事(5)
- PHP邮件发送例子,已测试成功(5)
- 致初学者:PHP比ASP优秀的七个理由(4)
- PHP会被淘汰吗?(4)
- PHP新手上路(四)(4)
- 如何去学习PHP?(2)
- 简单入门级php分页代码(2)
- php中邮箱email 电话等格式的验证(2)