WordPress中srcset适配图片失败：wp_get_attachment_image_srcset返回false

嘿，我来帮你解决这个问题！首先来说说wp_get_attachment_image_srcset返回false的常见原因，再给你适配需求的具体代码方案。

为什么wp_get_attachment_image_srcset会返回false？ #

大概率是这几个原因：

• 缩略图尺寸没正确生成：虽然你说系统生成了medium和thumbnail，但可能实际元数据里没有这个尺寸的记录。可以去后台「设置-媒体」确认thumbnail的尺寸设置，然后用「Regenerate Thumbnails」插件重新生成所有图片的缩略图。
• 函数参数调用错误：wp_get_attachment_image_srcset的第二个参数如果是自定义尺寸，需要先注册，或者用数组指定宽高（比如wp_get_attachment_image_srcset($src_id, array(150, 150))）。
• 图片不是通过WP媒体库上传的：如果是直接传到服务器的图片，WP不会生成对应的缩略图元数据，自然拿不到srcset。

针对你的需求的解决方案 #

你要的是「≥768px加载thumbnail，≤767px加载full尺寸」，这里给你两种可靠的实现方式，不用依赖容易出问题的wp_get_attachment_image_srcset：

方法1：手动构建srcset和sizes属性

这种方式符合原生img标签的响应式规范，浏览器会自动选择合适的图片：

while ($sponsors->have_posts()) : $sponsors->the_post();
    $src_id = get_post_thumbnail_id();
    if (!$src_id) continue; // 没有缩略图就跳过

    // 获取两种尺寸的图片信息
    $thumbnail_data = wp_get_attachment_image_src($src_id, 'thumbnail');
    $full_data = wp_get_attachment_image_src($src_id, 'full');

    if (!$thumbnail_data || !$full_data) continue;

    $thumbnail_url = $thumbnail_data[0];
    $thumbnail_width = $thumbnail_data[1];
    $full_url = $full_data[0];
    $full_width = $full_data[1];
    $alt_text = get_post_meta($src_id, '_wp_attachment_image_alt', true) ?: get_the_title();

    // 手动构建srcset和sizes
    $srcset = "{$thumbnail_url} {$thumbnail_width}w, {$full_url} {$full_width}w";
    $sizes = "(min-width: 768px) {$thumbnail_width}px, 100vw";

    // 输出图片标签（注意转义安全）
    echo '<img 
        src="' . esc_url($full_url) . '" 
        srcset="' . esc_attr($srcset) . '" 
        sizes="' . esc_attr($sizes) . '" 
        alt="' . esc_attr($alt_text) . '" 
    />';
endwhile;
wp_reset_postdata(); // 别忘了重置post数据，避免后续全局变量混乱

方法2：使用picture标签（更直观）

如果你觉得srcset的逻辑不好理解，用<picture>标签可以更清晰地指定不同屏幕下的图片：

while ($sponsors->have_posts()) : $sponsors->the_post();
    $src_id = get_post_thumbnail_id();
    if (!$src_id) continue;

    $thumbnail_url = wp_get_attachment_image_url($src_id, 'thumbnail');
    $full_url = wp_get_attachment_image_url($src_id, 'full');
    $alt_text = get_post_meta($src_id, '_wp_attachment_image_alt', true) ?: get_the_title();

    if (!$thumbnail_url || !$full_url) continue;

    // 输出picture标签
    echo '<picture>
        <source media="(min-width: 768px)" srcset="' . esc_url($thumbnail_url) . '">
        <img src="' . esc_url($full_url) . '" alt="' . esc_attr($alt_text) . '" />
    </picture>';
endwhile;
wp_reset_postdata();

额外提醒 #

• 不管用哪种方法，都要确保thumbnail尺寸的图片确实存在，可以通过访问wp-content/uploads/xxxx/xx/你的图片名-150x150.jpg（假设thumbnail是150x150）来验证。
• 记得给图片加alt文本，既符合无障碍规范，也利于SEO。

内容的提问来源于stack exchange，提问作者Darren