
本文详解为何使用`the_sub_field()`会导致html标签无法渲染,以及如何通过`get_sub_field()`正确获取并安全输出acf字段值,确保`
`等结构化内容正常显示。
在WordPress主题开发中,配合Advanced Custom Fields(ACF)插件动态输出内容时,一个常见却容易被忽视的错误是混淆了 the_sub_field() 与 get_sub_field() 这两个函数——它们虽名称相似,但行为截然不同:
- ✅ get_sub_field('field_name'):返回字段值(字符串),不自动输出,需配合 echo 显式打印,支持后续PHP逻辑处理(如 empty() 判断、字符串操作等);
- ❌ the_sub_field('field_name'):直接输出(echo)字段值并返回 void,其返回值为 null,因此赋值给变量(如 $process_title = the_sub_field(...))后,该变量实际为空,后续 echo $process_title 仅输出空字符串或引号包裹的原始文本(尤其当字段含HTML时,浏览器会将其作为纯文本渲染,而非解析为DOM元素)。
你原代码的问题正在于此:
这行代码等价于:
导致 $process_title 恒为空,if(!empty($process_title)) 判断失效,且即使进入区块,echo $process_title 也无内容可输出——表面上看到“带引号的纯文本”,实则是因字段值未被正确捕获,浏览器将残留的HTML字符(如
)当作文本节点显示。
立即学习“前端免费学习笔记(深入)”;
✅ 正确写法应使用 get_sub_field() 获取值,并显式输出:
⚠️ 重要安全提示:
若ACF字段允许用户输入富文本(如WYSIWYG编辑器),直接 echo $process_title 存在XSS风险。推荐使用 wp_kses_post() 过滤,它保留WordPress默认允许的HTML标签(如
, , 等),同时移除危险属性(如 onclick, javascript: 协议等):
? 额外建议:
- 在ACF字段设置中,确认“Return Format”为 String(非 Array 或 Object),否则 get_sub_field() 返回数组,需进一步提取(如 ['value']);
- 若字段位于Repeater或Flexible Content子循环内,确保 get_sub_field() 调用处于正确的循环作用域;
- 开发阶段可临时添加 var_dump($process_title); 验证变量类型与内容,快速定位是否为空或格式异常。
遵循此规范,即可确保ACF字段中的HTML结构(如











