调用文章第一个图片
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 支持, 并设定了 180×180 和 120×120 两种尺寸的图片.
其中 add_image_size 用于定义一种特征图片尺寸, 参考 WordPress Codex, 实际上它有 4 个参数.
-
第 1 个参数: 特征图片的尺寸别名, 用于调用不同尺寸的缩略图.
-
第 2 个参数: 图片的宽度
-
第 3 个参数: 图片的高度
-
第 4 个参数: 参数是个布尔值, 用于指定图片的裁切方式. 默认为 false.
如果为 true, 图片会按较大的压缩比例处理, 多余部分裁剪掉. 比如现在有图片 900×600, 要求压缩成 150×150 的图片, 那么会先将图片压缩成 225×150 的图片, 才裁剪成 150×150.
如果为 false, 图片会按较小的压缩比例处理. 比如现在有图片 900×600, 要求压缩成 150×150 的图片, 那么会将图片压缩成 150×100 的图片.
下图是两个缩略图, 原图 1024×768, 左缩略图是 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'); 展示 180×180 的缩略图, 而在文章底部的相关文章区域通过 the_post_thumbnail('recommend'); 展示 120×120 的缩略图.
3. 在编写文章的时候设定特征图片.
如果我们为主题添加了特征图片支持, 在编辑文章页面上传图片后, 在 Insert into Post 按钮的旁边可以找到 Use as featured image 链接将图片设为特征图片.
PS：巧用 WordPress 缩略图
WordPress 不仅是博客, 很多时候 WordPress 还被用作为 CMS (内容管理系统). 博主们喜欢为每个文章加上统一大小的缩略图, 尤其是信息类平台. 其中比较常用的处理办法是用 custom field 向文章插入图片, 通过上传大小一致的小图或者使用 phpThumb 等工具生成缩略图.
2.7 开始, WordPress 大幅提升多媒体功能, 越来越多人使用 WP 的内置图片仓库. 对这些用户来说, 制作缩略图变得并不那么困难, 在上传图片的时候就会默认生成 150×150 规格的小图 (如果图片高度/宽度不足 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...'); ?>
原创文章，作者：CUWRF，如若转载，请注明出处：http://www.wangzhanshi.com/n/10925.html
