尽量多用视觉。图像比文字更容易记忆，可以使学习更有效率（甚至可以让知识回想与转述的效率提升89%）。图像也可以让事情更容易理解，将文字放进或靠近想关联的图像中，而不是把文字放在底部或下一页，让学习者解读相关内容时可达到事半功倍的效果。
所以技术文章，最好配一些图，虽然可以完全靠文字来理解，但是一张图片能够让读者更容易理解，所以图片是技术文章不可或缺的一部分。这篇文章介绍wordpress缩略图的几种方法。
wordpress自带的缩略图功能（特色图像）
只需要在functions.php中加入代码就能实现此功能。 add_theme_support( 'post-thumbnAIls' );//可以针对页面或者日志开启此功能 add_theme_support( 'post-thumbnails', array( 'post' ) ); // 给日志启用日志缩略图 add_theme_support( 'post-thumbnails', array( 'page' ) ); // 给页面启用日志缩略图 wordpress开启特色图片功能代码
-----------------------------------------------------------------------------------------------------
开启此功能后会在文章的右下角出现此功能。如果已经确认开启，却没有发现此功能，在编写文章的页面，显示选项中查看是否显示此项。
然后在要调用的地方加入如下代码：
<?php the_post_thumbnail(); ?>
特色图片其他操作
缩略图设置不同的尺寸，但是缺点是你如果本来默认3中大小尺寸，你再加3个，总共有6张大小不同的图片，有点浪费空间。
add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 150, 150, true ); // 默认尺寸的设置顺序是: 宽度、高度 add_image_size( 'first', 50, 50, true );//设置顺序:名称、宽度、高度 add_image_size( 'second', 75, 75, true ); add_image_size( 'third', 100, 100, true );
要调用的地方加入如下代码
<?php the_post_thumbnail('second'); ?>
给图片加入alt，class属性
<?php the_post_thumbnail('thumbnail',array(
'alt' => trim(strip_tags( $post->post_title )),
'title'=> trim(strip_tags( $post->post_title )),
‘class’ =>‘thumb’
)
); ?>
自定义设置缩略图
完善的大概有两种，其中缓存版是将外链图片复制到自己服务器上。
非缓存版缩略图操作方法
非缓存版php代码如下：
//缩略图获取post_thumbnail
function post_thumbnail( $width = 275,$height = 170 )
{
global $post;
//如果有特色图片则取特色图片
if ( has_post_thumbnail() )
{
echo '<a href="'.get_permalink().'" class="thumbnail">';
$domsxe = simplexml_load_string(get_the_post_thumbnail());
$thumbnailsrc = $domsxe->attributes()->src;
echo '<img src="'.$thumbnailsrc.'" alt="'.trim(strip_tags( $post->post_title )).'" width="'.$width.'" height="'.$height.'"/>';
echo '</a>';
}
else
{
$content = $post->post_content;
preg_match_all('/<img.*?(?: |\t|\r|\n)?src=['"]?(.+?)['"]?(?:(?: |\t|\r|\n)+.*?)?>/sim', $content, $strResult, PREG_PATTERN_ORDER);
$n = count($strResult[1]);
//没有设置特色图片则取文章第一张图片
if($n > 0)
{
echo '<a href="'.get_permalink().'" class="thumbnail"><img src="'.$strResult[1][0].'" alt="'.trim(strip_tags( $post->post_title )).'" width="'.$width.'" height="'.$height.'"/></a>';
}
else
{
//既没有设置特色图片、文章内又没图片则取默认图片
echo '<a href="'.get_permalink().'" class="thumbnail"><img src="'.get_bloginfo('template_url').'/img/no-has-thumbnail.png" alt="wordpress技巧——特色图像功能以及自定义缩略图设置" alt="'.trim(strip_tags( $post->post_title )).'" width="'.$width.'" height="'.$height.'"/></a>';
}
}
}
以上代码加入functions.php中，调用方法如下：
<?php post_thumbnail(210,130); ?>
因为它智能采取缩略图又可以自定义大小，但是对于有些用外链图片的博客则有点欠妥，，引用外链图片影响网页加载速度和已写不稳定因素，以下缓存版就能解决外链图片问题。
缓存版缩略图操作方法
缓存版缩略图php代码如下：
// 加入缩略图
add_theme_support( 'post-thumbnails' );
function post_thumbnail( $width = 100,$height = 80 ){
global $post;
if( has_post_thumbnail() )
{ //如果有缩略图，则显示缩略图
$timthumb_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID),'full');
$post_timthumb = '<img src="'.get_bloginfo("template_url").'/timthumb.php?src='.$timthumb_src[0].'&h='.$height.'&w='.$width.'&zc=1" alt="'.$post->post_title.'" class="thumb" />';
echo $post_timthumb;
}
else
{
$post_timthumb = '';
ob_start();
ob_end_clean();
$output = preg_match('/<img.+src=['"]([^'"]+)['"].*>/i', $post->post_content, $index_matches); //获取日志中第一张图片
$first_img_src = $index_matches [1]; //获取该图片 src
if( !empty($first_img_src) )
{//如果日志中有图片
$path_parts = pathinfo($first_img_src); //获取图片 src 信息
$first_img_name = $path_parts["basename"]; //获取图片名
$first_img_pic = get_bloginfo('wpurl'). '/cache/'.$first_img_name; //文件所在地址
$first_img_file = ABSPATH. 'cache/'.$first_img_name; //保存地址
$expired = 604800; //过期时间
if ( !is_file($first_img_file) || (time() - filemtime($first_img_file)) > $expired )
{
copy($first_img_src, $first_img_file); //远程获取图片保存于本地
$post_timthumb = '<img src="'.$first_img_src.'" alt="'.$post->post_title.'" class="thumb" />'; //保存时用原图显示
}
$post_timthumb = '<img src="'.get_bloginfo("template_url").'/timthumb.php?src='.$first_img_pic.'&h='.$height.'&w='.$width.'&zc=1" alt="'.$post->post_title.'" class="thumb" />';
} else
{ //如果日志中没有图片，则显示默认
$post_timthumb = '<img src="'.get_bloginfo("template_url").'/images/default_thumb.gif" alt="wordpress技巧——特色图像功能以及自定义缩略图设置" alt="'.$post->post_title.'" class="thumb" />';
}
echo $post_timthumb;
}
}
将以上代码塞入functions.php文件中，然后操作以下两步：
- 主题文件中加入timthumb.php文件
- 调用方法
<? php post_thumbnail( 100,80 ); ?>其中参数是必须的。
