WordPress ACF图片显示问题：变量调用失效原因及解决方法

问题核心在于ACF的the_sub_field()和get_sub_field()的本质区别：

• the_sub_field()：直接把字段内容输出到页面，不会返回值。你用它给变量赋值时，其实已经把URL直接打印在页面上了，变量本身是空的，所以后面<img src="<?php echo $image ?>">里的$image没内容，导致URL提前显示，图片加载失败。
• get_sub_field()：仅返回字段内容，不会直接输出，适合赋值给变量后再按需使用。

修正后的代码示例 #

if(get_row_layout() == 'bq_product'):
        // 用get_sub_field获取值，不直接输出
        $image = get_sub_field('affiliate_image');
        $affiliate_url = get_sub_field('affiliate_url');
                
        // 现在可以正常通过变量调用
        ?><img src="<?php echo esc_url($image); ?>"/><?php // 用esc_url做安全处理，更规范
        ?><a href="<?php echo esc_url($affiliate_url); ?>">Link</a><?php
endif;

额外提示 #

• 建议加上esc_url()对URL做转义处理，避免XSS安全问题，这是WordPress开发的规范做法。
• 如果你之前用get_sub_field没生效，大概率是字段名称拼写错误（注意大小写敏感），或是代码逻辑里有未闭合的PHP标签这类语法问题。

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