wordpress缩略图thumbnail尺寸控制
1、通过后台,控制wordpress缩略图尺寸
我们在上传图片的时候,wordpress会为我们创建图片副本,不过它们都是经过内部调整的,或进行缩小,或进行裁剪。那么怎么去控制这些创建时对图片尺寸的规定呢?
首先,我们在wordpress的后台设置中能对上传图片的尺寸做规定。如图:
wordpress上传图片时,会根据上传图片的大小来对图片进行副本的创建,就像上图中的设置一样,如果图片宽度或高度大于1024像素那么就会 创建三个副本:150px*150px、300px*300px、1024px*1024px;加上图片本身,服务器上就会保存四张图片。而当图片宽度或 高度大于300像素,小于1024像素时,不会创建1024px*1024px的那张,以此类推,图片越小创建副本的张数就可能减少。上图中的缩略图大小 会作为文章post_thumbnail的缩略图,可以用the_post_thumbnail('thumbnail')调用, (the_post_thumbnail可不带参数,效果相同。)
当我们在插入一张图片之后,可以在插入选项中发现,由于这张图片大小小于1024像素,因此没有创建大的缩略图,不能选择“大”。如果这张图再小于300像素的话,连中等都没得选择。
在缩略图大小下面有一个选项,是否裁剪到这个尺寸。选择时,wordpress会按照所填写的大小,裁剪出一个150px*150px的图片,这个 图片将会按照小边的宽度,大边的居中部位裁剪(下图演示)。如果不选择,就会把图片最大的那条边缩小到150px,但图片的长宽比不变。这里的宽度和高度 是可变的,不一定要相等。
这张图可以很好的说明勾选缩略图下的裁剪选项与否的效果,左侧是原图,右上角为勾选后裁剪得到的一个150px*150px的缩略图,裁剪时图片的顶部和底部被剪掉了。而右下角的图片为不勾选的效果,图片只是按比例将最大边缩小到150px,没有进行裁剪。
只有小图缩略图在勾选之后会进行裁剪,而中等、大等缩略图是不会进行裁剪的,只会按比例缩放副本。
我们也可以不需要创建这么多的副本,甚至不需要创建缩略图副本,在设置中,删除所有的大小设置,全部留空。这时不会创建副本,插入图片的地方也无法进行选择,只能插入原图。
2、通过增加缩略图型号控制尺寸
上文讨论了wordpress后台可设置的部分,而在主题制作中,我们还有不可见的缩略图尺寸控制。我们知道,只有在wordpress主题的 functions.php中规定了add_theme_support('post-thumbnails');才能正常使用wordpress的文章 缩略图(特色图片功能,上文讨论的可以不用特色图片功能就能实现,但如果前台要调用而非仅仅进行插入的话,必须增加该功能。),同时,我们在规定该功能之 后,还能配置我们自己想要的图片尺寸。
在wordpress文章特色图片功能详解一文中,我也已经谈到了缩略图的尺寸问题,不过并不尽全。在默认情况下,wordpress有下面几种缩略图尺寸:
缩略图(Thumbnail)
小图(Small)
中等图(Medium)
大图(Large)
原图(Full)
它们是针对调用的,在没有进行型号的增加时,我们即可用the_post_thumbnail()调用这几种尺寸(对应的图片存在才会调用,不存在 会自动降一级或使用原图)。这几个默认的尺寸,其实正好对应后台设置尺寸,他们调用到的大小正式后台设置的情况。不过也有例外,当我们已经有了一些副本的 时候,我们竟然改动了后台的设置,这个时候遗憾的是,系统将会调用原图,无论你选择哪种尺寸,因为尺寸大小对应的图片已经不存在了(wordpress按 照图片的尺寸保存副本)。
我们可以增加一些型号,补充我们对文章缩略图的尺寸需求。例如,我们并不需要很多尺寸,只需要原图,和将原图缩略为600*250的一张图,只需两 张即可,我们可以把后台所有选项设置为空,在add_theme_support('post-thumbnails');后紧接着加上一句:
set_post_thumbnail_size(600,250,true);
这样,wordpress将为我们创建一张600*250经过裁剪的副本(将上面第三个参数设置为false表示不进行裁剪,只按比例缩小),而在调用时,我们需要用the_post_thumbnail('post-thumbnail');而非the_post_thumbnail();。虽然post-thumbnail型号也算是内置的,但是它需要set_post_thumbnail_size声明后才能用。
由于我们采用的是set_post_thumbnail_size的方法,并把后台设置设为空,因此,在后台插入图片时,没有其他尺寸的图片可以选 择,只能插入原图。为了可以有选择的余地,你可以不用set size,而是将后台缩略图一项设置为600*250即可,这样既可以生成一张缩略图副本,又可以插入这个副本到文章中。
这里需要插入说明的一点是,the_post_thumbnail();不带参数(默认参数为thumbnail)的缩略图调用,会自动调用出一张 后台设置了大小的可用的最小的一张缩略图,如果没有设置,则调用原图。它不会调用set_post_thumbnail_size设置的大小的那张图。
默认型号thumbnail和small的区别在于,当图片很小很小,甚至比最小设置的那个尺寸还小时,thumbnail所指的是原图。其他大多数情况下,thumbnail为参数调用都会调用后台设置了大小的可用的最小的一张缩略图。
除此之外,我们还可以增加其他型号的缩略图,不过和set_post_thumbnail_size一样,新增的型号不能用在插入文章和直接调用中。例如,我们可以用下面的方法来增加一个缩略图副本:
add_image_size('test-cover',450,250,true);
如果增加这一条的话,我们在上传一张图片之后,还会创建一张450*250的副本,前提是这张图片的长或宽比这个值更大。注意最后一个参数,仍然为 强制裁剪的意思。在主题中,我们可以用the_post_thumbnail('test-cover');调用这个副本。用这种方法,我们可以创建任意 的副本。
3、调用不同尺寸的缩略图
我们一直谈到the_post_thumbnail来调用,其实,在之前的这篇文章中,我已经介绍了多个可以调用缩略图的函数。在wordpress主题文制作中,我们将这些调用函数放在文章LOOP循环内,并把型号当做参数赋给它,就能调用出不同型号的图片。
例如the_post_thumbnail('large');调用大尺寸的图片,the_post_thumbnail('test-cover');调用增加的尺寸副本。它将直接打印出不带链接的图片。
能够进行缩略图调用的函数有:
the_post_thumbnail() get_the_post_thumbnail()
wp_get_attachment_image_src()
它们的具体用法就不详细解说,你可以通过wordpress官方了解它们。通过这几个函数,我们就可以非常方便的调用出我们的各个尺寸型号的缩略图
讲解的非常透彻,认真学习会了,赞
我百度了,没解决,缩略图参数宽高都订了,但是显示不对,高度不统一。
在页面看代码就是
就没有显示height
怎么解决啊,插件都更新到最新WP也更新最新了
非常不错!!!!
我只有一个观点,牛逼!!
来看看很好啊
介绍的好全面,总算解决了我之前的一些疑惑。
博主介绍的很详细哦!
博主这是职业研究PHP的啊!!
专职PHP。
来看看。
专注WP啊
话说能像你这样,坚持每天发布一篇技术文章的博客不多见啊,可见有多用心啊
不过缩略图有阵子我也想弄过,后来觉得首页不需要弄的那么花里胡哨,纯文字简单实在
嗯,纯文字的比较简单大气。
我的是直接关掉了。
有些主题 就可以
我现在一般用 timthumb 截图,WP自带的截图功能每张都生成多余的缩略图,很占用空间,如果更换其他主题,缩略图大小不一样,还得想办法删除和重新生成新尺寸,太麻烦了
我通常都是通过FTP来上传缩略图,WP上传会产生多余的数据库ID和生成多余的缩略图。
好想用不到这些功能啊