WordPress博客常用的两个调用缩略图的方法

时间:2023-06-30 07:48:26 其他范文 收藏本文 下载本文

WordPress博客常用的两个调用缩略图的方法(精选6篇)由网友“travaillerdur”投稿提供,下面是小编整理过的WordPress博客常用的两个调用缩略图的方法,欢迎您阅读,希望对您有所帮助。

WordPress博客常用的两个调用缩略图的方法

篇1:WordPress博客常用的两个调用缩略图的方法

在博客上用到缩略图的机会很多,它们出现在文章列表页面,文章下方的相关文章,分类页面的类目图片,甚至有些博客很新潮地淡化文字以图片瀑布流作为文章索引,

站长们知道缩略图可以吸引眼球,一直在寻找更好的使用方法。本文将会介绍WordPress上常用的两个调用缩略图的方法,以及他们的适用场景。

调用文章第一个图片

WordPress Media一直支持上传图片生成包括缩略图,中等尺寸,大尺寸和原图4个规格的图片,而这恐怕是为了方便我们在文章内调用不同尺寸的图片。

凭文章ID就可以找到第一个图片。这里可以写成方法如下,用户获取第一个缩略图,如果没有上传过图片,返回空字符串。

function getFirstImage($postId) {

$args = array(

'numberposts' =>1,

'order'=>'ASC',

'post_mime_type' =>'image',

'post_parent' =>$postId,

'post_status' =>null,

'post_type' =>'attachment'

);

$attachments = get_children($args);

// 如果没有上传图片, 返回空字符串

if(!$attachments) {

return '';

}

// 获取缩略图中的第一个图片, 并组装成 HTML 节点返回

$image = array_pop($attachments);

$imageSrc = wp_get_attachment_image_src($image->ID, 'thumbnail');

$imageUrl = $imageSrc[0];

$html = '';

return $html;

}

调用的代码如下。

$thumb = getFirstImage($post->ID);

if(strlen($thumb) >0) {

echo $thumb;

} else {

// 显示默认图片或者不做任何事情

}

文章特征图片(Featured Image)功能

WordPress 2.9之后,WordPress 提供了文章特征图片功能,可以为文章设定一个上传的图片作为特征图片,并可以给图片设定多个尺寸以便在不同的环境使用。可按一下步骤调用:

1. 为WordPress主题添加特征图片支持,并设定特征图片的尺寸和别名。

add_theme_support('post-thumbnails'); // 支持特征图片功能

add_image_size('thumb', 180, 180); // 别名为 thumb, 尺寸为 150x150 的设定

add_image_size('recommend', 120, 120); // 别名为 recommend, 尺寸为 120x120 的设定

我们可以将以上代码加到 functions.php 文件, 为主题添加添加了Featured Image 支持, 并设定了 180x180 和 120x120 两种尺寸的图片。

其中 add_image_size 用于定义一种特征图片尺寸, 参考 WordPress Codex, 实际上它有 4 个参数。

第 1 个参数: 特征图片的尺寸别名, 用于调用不同尺寸的缩略图。

第 2 个参数: 图片的宽度

第 3 个参数: 图片的高度

第 4 个参数: 参数是个布尔值, 用于指定图片的裁切方式,

默认为 false.

如果为 true, 图片会按较大的压缩比例处理, 多余部分裁剪掉。 比如现在有图片 900x600, 要求压缩成 150x150 的图片, 那么会先将图片压缩成 225x150 的图片, 才裁剪成 150x150.

如果为 false, 图片会按较小的压缩比例处理。 比如现在有图片 900x600, 要求压缩成 150x150 的图片, 那么会将图片压缩成 150x100 的图片。

下图是两个缩略图, 原图 1024x768, 左缩略图是 add_image_size('xxx', 120, 120, true);, 而右图使用的是 add_image_size('xxx', 120, 120, false);。

2. 判断是否存在特征图片和显示缩略图。

if(has_post_thumbnail) {

the_post_thumbnail('thumb');

} else {

// 显示默认图片或者不做任何事情

}

上述代码判断文章中是否存在特征图片,如果存在则显示别名为 thumb 的缩略图,如果没有可以显示默认图片或者留空。我们在前面还设定了别名为recommend的缩略图,那么我们可以在不同的场合使用不同的缩略图。比如:在文章列表页面使用 the_post_thumbnail('thumb'); 展示 180x180 的缩略图, 而在文章底部的相关文章区域通过the_post_thumbnail('recommend'); 展示 120x120 的缩略图。

3. 在编写文章的时候设定特征图片。

如果我们为主题添加了特征图片支持,在编辑文章页面上传图片后,在Insert into Post按钮的旁边可以找到Use as featured image链接将图片设为特征图片。

总结

WordPress 2.9 之前不存在特征图片(Featured Image)的概念,必须通过第一种方式找到图片附件。 用这种方式获取缩略图的好处是一劳永逸,以后你不用关心要文章的使用什么缩略图,是否存在缩略图。 但这同样也是它的缺点,不能指定特定图片为缩略图。如果某文章第一个图片是缩略图,但因为文章更新, 将第一个图片删除了,再上传。那本来第二个图片就成为了新的缩略图,但有可能第二个图片效果不好, 不适合作为缩略图也没是没有办法的,因为你根本没有办法使用特定图片。

Featured Image功能很强大,除了可以指定图片作为特征图片,还能够使用多个尺寸的图片以适合不同的场合,你要做的仅仅是每次写文章时别忘了设定特征图片。当你想去除所有缩略图时,也仅是将 functions.php 文件的add_theme_support('post-thumbnails'); 即可。

我现在没有用Featured Image, 一直用的是取第一个图片的方法,因为我的图片质量不高,一直没指定图片需求,懒得去改了。

篇2:巧用WordPress缩略图

WordPress 不仅是博客, 很多时候 WordPress 还被用作为 CMS (内容管理系统). 博主们喜欢为每个文章加上统一大小的缩略图, 尤其是信息类平台. 其中比较常用的处理办法是用 custom field 向文章插入图片, 通过上传大小一致的小图或者使用 phpThumb 等工具生成缩略图.

2.7 开始, WordPress 大幅提升多媒体功能, 越来越多人使用 WP 的内置图片仓库. 对这些用户来说, 制作缩略图变得并不那么困难, 在上传图片的时候就会默认生成 150x150 规格的小图 (如果图片高度/宽度不足 150px, 使用原高度/宽度). 那我们可以充分利用这个功能, 在文章列表上加上这个图片作为缩略图. 这样处理各有利弊, 好处是简单, 智能 (不用每次输入缩略图), 坏处是消耗服务器流量,

Okay, 现在要做的就是提取上传生成的小图片, 并放置在文章的适当位置. 我创建了一个文件 thumb.php, 图片获取和调用一起处理, 文件内容如下.

12345678910111213141516171819

<?php$args=array(“post_parent”=>$post->ID,“post_type”=>“attachment”,“post_mime_type”=>“image”);$images=&get_children(“post_type=attachment&post_mime_type=image&post_parent=”.$post->ID);$imageUrl=“”;if($images){$image=array_pop($images);$imageSrc=wp_get_attachment_image_src($image->ID);$imageUrl=$imageSrc[0];}else{$imageUrl=get_bloginfo(“template_url”).“/img/default.gif”;}?>“>” alt=“<?phpthe_title();?>” width=“150” height=“150” />

这段代码会去找第一个上传的图片缩略图 (如果第一个图片被删除, 则找第二个的, 如此类推...), 如果找不到任何上传图片则使用默认图片. 代码中用到 get_children 和 wp_get_attachment_image_src 两个方法, 可以参考下面两个文章.

WordPress Codex - get children

WordPress Codex - wp get attachment image src

然后在文章列表 index.php, 存档页面 archive.php 和搜索页面 search.php 中调用, 调用代码如下.

1

<?phpinclude(“thumb.php”);the_content(“Read More...”);?>

这段代码是把图片放在文章内容前面, 图片如何摆放需要用 CSS 调整一下布局, 这里就不多说了.

最后我两留两个问题给同学们.

1. 如果图片高度或者宽度不足 150px, 这样做必然将图片拉伸, 很不美观. 用什么办法可以让图片都显示为 150x150, 并居中显示? 提示: 可以用 CSS 实现, 类似方法可以在 Elegant Box 主题中找到.

2. 在文章列表中, 我们只希望看到缩略图, 而屏蔽其他所有图片, 除了使用文章摘要去除所有标签样式, 是否有其他方法可以做到?

本文来自:www.neoease.com/wordpress-thumb-trick/

篇3:wordpress常用的几种调用方法

最近张力用wordpress程序折腾了两套模板了,对于wordpress程序也玩了好几个月了,对于它的一些调用手法上也了解了一些,今天这篇文章就是跟大家讲一下常用的几种wordpress调用方法。

第一种:最新文章调用

这个是我们在用wordpress程序时经常要用到的,以下是调用代码:

<?php $rand_posts = get_posts(‘numberposts=8&orderby=post_date’); foreach( $rand_posts as $post ) : ?>

” title=”<?php the_title; ?>”><?php echo mb_strimwidth(get_the_title(), 0, 50, ‘…’); ?>

<?php endforeach; ?>

请注意,上面红色数字8是代表调用的文章条数,这个您可以自己调整的。而后面的0,50这个是调用文章的标题显示为50个字节,也就是文章标题最多显示25个字。

第二种:随机文章调用

这个也是我们在用wordpress程序时经常用到的,因为这个可以让你的页面时刻都是不同内容的,对于优化上是有一定好处的,具体代码如下:

<?php $rand_posts = get_posts(‘numberposts=8&orderby=rand’); foreach( $rand_posts as $post ) : ?>

” title=”<?php the_title(); ?>”><?php echo mb_strimwidth(get_the_title(), 0, 50, ‘…’); ?>

<?php endforeach; ?>

同上面提到的一样,红色数字8是代表调用的文章条数,这个您可以自己调整的。而后面的0,50这个是调用文章的标题显示为50个字节,也就是文章标题最多显示25个字。

第三种:热门文章调用

这个相信大家都知道,这个的调用可以显示我们网站最多浏览的文章,也就是用户最关注的文章。以下为调用代码:

<?php $postslist = get_posts(‘numberposts=8&order=DESC&orderby=comment_count’); foreach( $postslist as $post ) : ?>

” title=”<?php the_title(); ?>”><?php echo mb_strimwidth(get_the_title(), 0, 50, ‘…’); ?>

<?php endforeach; ?>

同上面两个一样,红色数字8是代表调用的文章条数,这个您可以自己调整的,

而后面的0,50这个是调用文章的标题显示为50个字节,也就是文章标题最多显示25个字。

第四种:置顶文章调用

这个大家就都不陌生了,这个是很多网站都有用到的,wordpress的置顶文章代码是分为两个部分的,我这里就给大家说一下。

<?php

$sticky = get_option(‘sticky_posts’);

rsort( $sticky );

$sticky = array_slice( $sticky, 0, 5);

query_posts( array( ‘post__in’ =>$sticky, ‘caller_get_posts’ =>1 ) );

if (have_posts()) :

while (have_posts()) : the_post();

?>

” title=”<?php the_title(); ?>” rel=”bookmark”><?php the_title(); ?>

<?php endwhile; endif; ?>

上面这段代码中$sticky, 0, 5中的5代表的是置顶文章调用条数,” title=”” rel=”bookmark”>代表的是调用的文章链接和标题。注意:大家在添加置顶文章时,一定不要忘了最后的。

第五种:调用指定分类

我们有时候在用wordpress程序时希望自己某一页面调用指定的分类,下面这段代码就可以让你在使用wordpress时,指定调用某个分类下的文章,代码如下:

<?php query_posts(‘cat=15&posts_per_page=8&caller_get_posts=1′); ?>

<?php while (have_posts()) : the_post(); ?>

” title=”<?php the_title(); ?>”><?php echo mb_strimwidth(get_the_title(), 0, 50, ‘…’); ?>

<?php endwhile; ?>

上面这段代码中的cat=15中的15代表的是分类ID,我们只需要修改这个数字为自己的分类ID就可以了;而数字8代表的是调用文章条数。这个你可以自己调整为自己想要显示的文章条数。

篇4:帝国cms调用wordpress博客或随机文章的方法

1、帝国cms里信息调用标签比较常用的是(ecmsinfo),如下图,是ecmsinfo调用标签的

格式,主要是栏目/

【WordPress博客常用的两个调用缩略图的方法(精选6篇)】相关文章:

Java开发毕业论文参考文献2023-06-07

PHOTOSHOP教案2022-06-11

托福听力内容连接排序题解析2023-01-20

毕业论文参考文献的写法2022-08-06

计算机专业毕业论文开题报告2023-11-10

人文社科类论文2023-10-22

python自定义解析简单xml格式文件的方法2022-05-07

IT信息门户网建设方案2022-04-29

对联生成器2023-02-01

简历写作之课程名称中英文对照2022-05-26

点击下载本文文档