本文主要是介绍如何获取文章中第一张图片并显示图片,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
在写wordpress模板的时候,一般为了布局合理而且显示的较为美观,作者会考虑加入此项功能:获取wordpress文章中的第一张图片并显示出来。有些wordpress模板加入了缩略图功能,有些设置特色图片,虽然方法不同,但效果一样。比如暗淡的黑IT网络现用主题wpdaxue,采取第三方文件timthumb.php来获取缩略图,效果如下图。下面暗淡的黑在这提供两种代码方法实现wordpress取文章中第一张图片功能。

实现方法
此文代码预留地址:https://gist.github.com/andandehei/8928266
方法1.无视任何设置,直接获取文章中第一张图片并显示;如果文章无图片,获取自定义图片并显示。
此方法翻译自http://www.wprecipes.com/how-to-get-the-first-image-from-the-post-and-display-it
①将以下代码粘贴到functions.php文件中。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | function catch_that_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 $first_img = "/images/default.jpg" ; //请自行设置一张default.jpg图片 } return $first_img ; } |
②在需要显示图片的地方输出图片:
1 | <?php echo catch_that_image ( ) ?> |
方法2.如果我们手动设置了特色图像,而且文章中又有图片,那该如何显示呢?我们自此可以使用逻辑判断,给他们一个优先条件。此方法网上代码重复太多,已经不知道原创是谁了...
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | function catch_that_image ( $id ) { // global $post, $posts; $first_img = '' ; // 如果设置了缩略图 $post_thumbnail_id = get_post_thumbnail_id ( $id ) ; if ( $post_thumbnail_id ) { $output = wp_get_attachment_image_src ( $post_thumbnail_id , 'large' ) ; $first_img = $output [ 0 ] ; } else { // 没有缩略图,查找文章中的第一幅图片 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 ) ) { // 既没有缩略图,文中也没有图,设置一幅默认的图片 $first_img = "/images/default.jpg" ; } } return $first_img ; } |
这篇关于如何获取文章中第一张图片并显示图片的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!