You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何将两个ACF Group字段正确应用到同一个div元素

解决ACF两个Group字段应用到同一div的问题

你的核心错误是把Group字段当成了Repeater/Flexible Content这类可重复字段来处理,have_rows()函数是专门用来遍历可重复字段的,而Group是单一的字段组,直接调用子字段即可,不需要循环。

正确写法(基础场景)

如果两个Group字段是直接添加到文章/页面的自定义字段中,用以下代码即可:

<?php
// 先获取整个Group字段的数据
$desktop_padding = get_field('desktop_padding');
$mobile_padding = get_field('mobile_padding');

// 确保两个Group字段都有值再输出div
if ($desktop_padding && $mobile_padding) {
    // 拼接padding类名,同时用esc_attr转义避免XSS风险
    $padding_classes = sprintf(
        'padding-top-%s padding-bottom-%s mobile-padding-top-%s mobile-padding-bottom-%s',
        esc_attr($desktop_padding['desktop_padding_top']),
        esc_attr($desktop_padding['desktop_padding_bottom']),
        esc_attr($mobile_padding['mobile_padding_top']),
        esc_attr($mobile_padding['mobile_padding_bottom'])
    );
?>
<div class="<?php echo $padding_classes; ?>">
    <!-- 这里放置div的内容 -->
</div>
<?php } ?>

如果你需要在Repeater/Flexible Content中使用

如果这两个Group字段是嵌套在某个可重复字段(比如Repeater)里的,需要先遍历外层的重复字段,再在循环内调用Group子字段:

<?php if (have_rows('your_repeater_field_name')): ?>
    <?php while (have_rows('your_repeater_field_name')): the_row(); ?>
        <?php
        $desktop_padding = get_sub_field('desktop_padding');
        $mobile_padding = get_sub_field('mobile_padding');
        
        if ($desktop_padding && $mobile_padding) {
            $padding_classes = sprintf(
                'padding-top-%s padding-bottom-%s mobile-padding-top-%s mobile-padding-bottom-%s',
                esc_attr($desktop_padding['desktop_padding_top']),
                esc_attr($desktop_padding['desktop_padding_bottom']),
                esc_attr($mobile_padding['mobile_padding_top']),
                esc_attr($mobile_padding['mobile_padding_bottom'])
            );
        ?>
        <div class="<?php echo $padding_classes; ?>">
            <!-- 重复项的内容 -->
        </div>
        <?php } ?>
    <?php endwhile; ?>
<?php endif; ?>

为什么你之前的写法失效?

  • 嵌套循环:have_rows('desktop_padding')会返回false,因为Group不是可重复字段,外层循环根本不会执行,自然输出不了div。
  • 同时判断两个have_rows():同理,两个条件都不成立,if语句块内的代码完全不会运行。

内容的提问来源于stack exchange,提问作者chrishughs

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.08 07:09:55