wordpress自动调用文章第一张图为缩略图或显示随机图

 晓兔   2017-09-25 16:56   5,493 人飘过  6 条评论

现在的wordpress主题大多都集成了首页和列表页自动调用文章内第一张图片作为缩略图进行展示的功能,文内没有图片的话也会显示随机图片,以提高用户体验度。晓兔今天在整理以前几个老网站的时候,发现很多低版本的wordpress主题没有这些集成功能,又不想升级wordpress版本,于是只好手动添加代码来实现自动调用文章首图为缩略图的功能。

本以为是个很简单的功能,因为网上类似的教程很多,但是发现试了几个代码都无效,甚至语法错误,大概是很多年前的代码版本了,有些不太兼容。

以下是晓兔亲测可用的一个版本:

首先在主题文件夹下找到functions.php文件,添加一段代码:

//支持外链缩略图
if ( function_exists('add_theme_support') )
add_theme_support('post-thumbnails');
function catch_first_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content,
$matches);
$first_img = $matches [1] [0];
if(empty($first_img)){ //Defines a default image
$random = mt_rand(1, 20);
echo get_bloginfo ( 'stylesheet_directory' );
echo '/images/random/tb'.$random.'.jpg';
}
return $first_img;
}

在random文件夹内放入文件名如tb1.jpg,tb2.jpg,tb10.jpg等随机图片。

然后新建一个thumbnail.php文件,内容为:

<div class="thumbnail">
<?php if ( get_post_meta($post->ID, 'thumbnail', true) ) : ?>
<?php $image = get_post_meta($post->ID, 'thumbnail', true); ?>
<a href="<?php the_permalink() ?>" rel="nofollow" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php echo $image; ?>" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" /></a>
<?php else: ?>
<a href="<?php the_permalink() ?>" rel="nofollow" rel="bookmark" title="<?php the_title(); ?>"><img src="<?php echo catch_first_image() ?>" width="140px" height="100px" alt="<?php the_title(); ?>"/></a>
<?php endif; ?>
</div>

最后在首页或文章列表页相应位置插入:

<?php include('includes/thumbnail.php'); ?>

一定要仔细注意代码内的文件夹路径和名称是否正确,方可确保正常抓取和展示缩略图。

历史上的今天:

本文地址:https://www.loveif.com/post/631.html
版权声明:本文为原创文章,版权归 晓兔个人博客 所有,欢迎分享本文,转载请保留出处!

 发表评论


表情

  1. 绿软吧
    绿软吧 【农民】 @回复

    感谢分享,谢谢站长

  2. 广州网站建设
    广州网站建设 【村长】 @回复

    这个不错,学习了 [赞]

  3. 你好这个怎么弄
    你好这个怎么弄 【农民】 @回复

    “最后在首页或文章列表页相应位置插入:” 我怎么不明白这个意思啊。。我是WordPress新手,你说的首页或文章页,是那个文件呀。。

  4. 衍帝
    衍帝 【农民】 @回复

    前几天我也写过一个asp代码的获取文章第一张图片做缩略图的文章,虽然和php有些差别,不过道理都一样

  5. 大事记
    大事记 【农民】 @回复

    学习了,博主棒棒哒