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

站长们晓得缩略图能够吸引眼球, 不断在寻觅更好的应用办法. 本文将会引见 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 = '<img src="' . $imageUrl . '" alt="' . the_title('', '', false) . '" />';
 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. 第 1 个参数: 特色图片的尺寸别名, 用于调用不同尺寸的缩略图.
2. 第 2 个参数: 图片的宽度
3. 第 3 个参数: 图片的高度
4. 第 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 链接将图片设为特色图片.

PS：巧用 WordPress 缩略图
WordPress 不只是博客, 很多时分 WordPress 还被用作为 CMS (内容治理零碎). 博主们喜爱为每个文章加上对立大小的缩略图, 尤其是信息类平台. 其中比拟罕用的解决方法是用 custom field 向文章拔出图片, 经过上传大小分歧的小图或许应用 phpThumb 等工具生成缩略图.

2.7 开端, WordPress 大幅晋升多媒体性能, 越来越多人应用 WP 的内置图片仓库. 对这些用户来说, 制造缩略图变得并不那么艰难, 在上传图片的时分就会默许生成 150x150 规格的小图 (假如图片高度/宽度有余 150px, 应用原高度/宽度). 那咱们能够充沛利用这个性能, 在文章列表上加上这个图片作为缩略图. 这样解决各无利弊, 益处是简略, 智能 (不必每次输出缩略图), 害处是耗费效劳器流量.

Okay, 如今要做的就是提取上传生成的小图片, 并搁置在文章的适当地位. 我创立了一个文件 thumb.php, 图片获取和调用一同解决, 文件内容如下.

<?php
 $args = array(
 'numberposts' => 1,
 'order'=> 'ASC',
 'post_mime_type' => 'image',
 'post_parent' => $post->ID,
 'post_status' => null,
 'post_type' => 'attachment'
 );
 
 $attachments = get_children($args);
 $imageUrl = '';
 
 if($attachments) {
 $image = array_pop($attachments);
 $imageSrc = wp_get_attachment_image_src($image->ID, 'thumbnail');
 $imageUrl = $imageSrc[0];
 } else {
 $imageUrl = get_bloginfo('template_url') . '/img/default.gif';
 }
?>
<a href="<?php the_permalink() ?>"><img class="left" src="<?php echo $imageUrl; ?>" alt="<?php the_title(); ?>" width="150" height="150" /></a>

这段代码会去找**个上传的图片缩略图 (假如**个图片被删除, 则找第二个的, 如此类推...),而后在文章列表 index.php, 存档页面 archive.php 和搜寻页面 search.php 中调用, 调用代码如下.

<?php include('thumb.php'); the_content('Read More...'); ?>

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

总结

WordPress 2.9 之前不存在特色图片 (Featured Image) 的概念, 必需经过**种形式找到图片附件. 用这种形式获取缩略图的益处是一劳永逸, 当前你不必关怀要文章的应用什么缩略图, 能否存在缩略图. 但这同样也是它的缺陷, 不能指定特定图片为缩略图. 假如某文章**个图片是缩略图, 但由于文章更新, 将**个图片删除了, 再上传. 那原本第二个图片就成为了新的缩略图, 但有可能第二个图片成果不好, 不适宜作为缩略图也没是没有方法的, 由于你基本没有方法应用特定图片.

Featured Image 性能很弱小, 除了能够指定图片作为特色图片, 还可以应用多个尺寸的图片以适宜不同的场所, 你要做的仅仅是每次写文章时别忘了设定特色图片. 当你想去除一切缩略图时, 也仅是将 functions.php 文件的 add_theme_support('post-thumbnails'); 即可.

我如今没有用 Featured Image, 不断用的是取**个图片的办法, 由于我的图片品质不高, 不断没指定图片需要, 懒得去改了.

以上就是安达网络工作室关于《WordPress中缩略图的使用以及相关技巧》的一些看法。更多内容请查看本栏目更多内容！