让 WordPress 缩略图机制支持URL外链图片

2013.07.19 100 Comments 766 次阅读

wordPress Category

最近为一位朋友定制一款图片主题,为其使用了 七牛云存储 服务,但是想让缩略图支持URL外链引用图片,虽然说七牛有api可以直接调用不同大小的图片,但是对于某人的博客来说,或许是大材小用。对于很多朋友来说,这个api可能很方便,但是却非常难以折腾。这里周良为大家提供一个最简单的方法(非调用API,而是所有的外链图片 WordPress 都可以支持的方法)。

下面是本方法的特地:

  • 支持手动上传缩略图
  • 支持缩略图外链引用
  • 如果文章内包含有图片,就用第一张图片做为缩略图
  • 如果文章内没有图片,则用默认的图片

其实就是用 WordPress 提供的自定义栏目功能来解决。

$postImageUrl = get_post_meta($post->ID, ‘thumbnail’, true); //设置自定义栏目名为“thumbnail”

1.在functions.php文件中添加下面代码:

//缩略图获取
add_theme_support( ‘post-thumbnails’ );
set_post_thumbnail_size( 262, 114 ,true );//设置缩略图的尺寸
function dm_the_thumbnail() {
global $post;
$postImageUrl = get_post_meta($post->ID, ‘thumbnail’, true); //设置自定义栏目名为“thumbnail”
// 判断该文章是否设置有缩略图,如果有则直接显示
if ( has_post_thumbnail() ) {
echo ‘<span class=”work-thumbnail”>’;
the_post_thumbnail();
echo ‘</span>’;
} elseif ($postImageUrl) {
echo ‘<span class=”work-thumbnail”><img alt=”” src=”‘.$postImageUrl.’” /></span>’;
} 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 ‘<span class=”work-thumbnail”><img alt=”” src=”‘.$strResult[1][0].’” /></span>’;
}else { // 如果文章内没有图片,则用默认的图片
echo ‘<span class=”work-thumbnail”><img alt=”” src=”‘.get_bloginfo(‘template_url’).’/images/thumbnail.jpg” /></span>’;
}
}
}

2.折腾完这些步骤以后,需要后台界面右上角点击显示选项,勾选自定义栏目。

3.获取timthumb.php文件,放在主题根目录下
然后调整样式之类的,关于代码中的结构和类名可以修改为适合自己所使用的主题。

原文:UECSS

100 Responses
Comment (16)
Trackback (0)
  • #31
    jokrface :

    funcitions.php这个文件是不是在主题的那个文件夹里面的functions.php?

    2014.05.22 19:22 Reply
  • #32
    jokrface :

    funcitions.php这个文件是不是在主题的那个文件夹里面的functions.php?

    2014.05.22 19:22 Reply
  • #33
    小周周不求人 :

    你好,直接复制代码加入为什么会报错呢,和下边朋友的错误一样

    2014.04.5 14:48 Reply
  • #34
    小周周不求人 :

    你好,直接复制代码加入为什么会报错呢,和下边朋友的错误一样

    2014.04.5 14:48 Reply
  • #35
    小二苘 :

    这个方法会加载图片到本地么?

    2014.02.16 13:09 Reply
  • #36
    小二苘 :

    这个方法会加载图片到本地么?

    2014.02.16 13:09 Reply
  • #37
    TikyZ :

    为什么添加进functions里 多行报错.. 是为什么 该怎么添加

    2014.02.13 19:08 Reply
    • 周良 :

      估计你加错位置了

      2014.02.13 21:58 Reply
  • #38
    TikyZ :

    为什么添加进functions里 多行报错.. 是为什么 该怎么添加

    2014.02.13 19:08 Reply
    • 周良 :

      估计你加错位置了

      2014.02.13 21:58 Reply
  • #39
    菜贩儿 :

    我现在也是用timthumb.php来获取图片,但代码不是你这里的,虽然支持外链了,但老是有一些图片没有办法显示,不知道为什么,采用你的这个代码之后就会显示Parse error: syntax error, unexpected ‘&’ in /home/pmiqbzhy/public_html/caifan/wp-content/themes/inkforbean2.4.1/functions.php on line 577请问怎么解决呢,好像这个和外链没有什么关系吧,我现在用的是百度的外链,但缩略图有时候不显示的都是放在本地的自动调用的图片。

    2014.01.12 08:38 Reply
  • #40
    菜贩儿 :

    我现在也是用timthumb.php来获取图片,但代码不是你这里的,虽然支持外链了,但老是有一些图片没有办法显示,不知道为什么,采用你的这个代码之后就会显示Parse error: syntax error, unexpected ‘&’ in /home/pmiqbzhy/public_html/caifan/wp-content/themes/inkforbean2.4.1/functions.php on line 577请问怎么解决呢,好像这个和外链没有什么关系吧,我现在用的是百度的外链,但缩略图有时候不显示的都是放在本地的自动调用的图片。

    2014.01.12 08:38 Reply
  • 还没有Trackback
Leave a Reply