^ 回到顶部
  • 人生没有定律,每个人都有自己的节奏
  • 本站wordpress建站教程均通过实践后发布,希望对你有帮助,如果有代码出错,请联系站长解决
  • 希望你的坚持,都是因为热爱,而不是因为不甘心
  • 8年wordpress建站经验,5星服务品质
  • 那些不愿意让你吃亏的人,才是真正值得你深交的人,也是值得你付出时间的人
  • 腾讯云3年2核2G新品轻量限时特惠只需408元

WordPress调用文章中所有图片的缩略图

WordPress调用文章中所有图片的缩略图

xiu 主题最大的特点就是在首页可以调用文章中多张多略图,很适合做图片站、陌小雨发现很多人也拿来做淘宝客站或者色站,之前分享过一篇文章介绍WordPress xiu 主题如何统计文章中图片数量,今天分享 wordpress 如何调用文章中所有图片的缩略图并在首页显示。

2 核 2G 限时特惠 396 元/3 年    宝塔建站 10850 大礼包

功能代码:

/*
*WordPress 首页输出文章所有图片缩略图
*/
function all_img($soContent){
$soImages ='~<img [^\>]*\ />~';
preg_match_all( $soImages, $soContent, $thePics );
$allPics = count($thePics);
if( $allPics > 0 ){
foreach($thePics[0] as $v){
echo $v;
}
}
else {
echo "<img src='";
echo bloginfo('template_url');
echo "/images/thumb.gif'>";
}
}

上面的代码会导致最后输出的图片全部是原大小尺寸,所以我们需要在输出图片时为其加上大小 style 的限制,所以需要改动一些代码;将上面第 16 行的代码改为:

<echo “/images/thumb.gif’ style=”width:278px;height:122px;”>”;

但当给予了 style 限制之后,图片的大小虽然都固定了下来,但却出现了图片的失真,因此我们还是最好使用 css 的方法去限制输出图片的大小,css 具体的代码就先不贴出来了,大家也可以自己去捯饬一下。

代码调用:

<
php all_img($post->post_content);
>

在模板文件中需要调用的地方使用上面的代码即可。

xiu 主题是在该基础上添加了判断语句,图片大于等于 1 张小于 4 张就只输出 1 张图片、大于等于 4 张小于 8 张就输出 4 张图片,大于 8 张就输出 8 张,一共用到 2 个函数:

post excerpt

post thumbnail

有兴趣的朋友可以进一步折腾。

2016 年 4 月 12 日更新

用了一段 xiu 主题后,发现很多代码改改还是蛮好用的。现在讲 xiu 主题实现方法分享出来,已经针对性的修改了,适用于其他主题

将下面代码加入到主题 functions.php 文件中

    function hui_get_thumbnail( $single=true, $must=true ) {
        global $post;
        $html = '';
        if ( has_post_thumbnail() ) {
            $domsxe = simplexml_load_string(get_the_post_thumbnail());
            $src = $domsxe->attributes()->src;
            $src_array = wp_get_attachment_image_src(hui_get_attachment_id_from_src($src), 'thumbnail');
            $html = sprintf('<li><img src="%s" /></li>', $src_array[0]);
        } else {
            $content = $post->post_content;
            preg_match_all('/<img.*(: |\\t|\\r|\\n)src=[\'"](.+)[\'"](:(: |\\t|\\r|\\n)+.*)>/sim', $content, $strResult, PREG_PATTERN_ORDER);
            $images = $strResult[1];
            $counter = count($strResult[1]);
            $i = 0;
            foreach($images as $src){
                $i++;
                $src2 = wp_get_attachment_image_src(hui_get_attachment_id_from_src($src), 'thumbnail');
                $src2 = $src2[0];
                if( !$src2 && true ){
                    $src = $src;
                }else{
                    $src = $src2;
                }
                $item = sprintf('<li><img src="%s" /></li>', $src);
                if( $single){
                    return $item;
                    break;
                }
                $html .= $item;
                if(
                    ($counter >= 4 && $counter < 8 && $i >= 4) ||
                    ($counter >= 8 && $i >= 8) ||
                    ($counter > 0 && $counter < 4 && $i >= $counter)
                ){
                    break;
                }
            }
        }
        return $html;
    }
    function hui_get_attachment_id_from_src ($link) {
        global $wpdb;
        $link = preg_replace('/-\d+x\d+(=\.(jpg|jpeg|png|gif)$)/i', '', $link);
        return $wpdb->get_var("SELECT ID FROM {$wpdb->posts} WHERE guid='$link'");
    }

在需要调用的地方:

<?php echo hui_get_thumbnail(false,true);>

赠人玫瑰,手有余香。