WordPress高级自定义字段中继器，每3个div换行 [英] WordPress Advanced Custom Fields Repeater, wrap every 3 divs in a row

问题描述

我正在使用高级自定义字段，并且希望将每3个div换行。如果有第四个div或第二个div，那么它们将被包裹在自己的行中。所以打开和关闭连续。

I'm using Advanced Custom Fields, and I would like to wrap every 3 divs in a row. If there is a fourth div or 2 extra then those would get wrapped in their own row. So open and close with a row.

我目前具有基本输出，但是当前所有添加计数器的尝试均失败。

I currently have the basic output but all my current attempts to add the counter have failed. Any help would be appreciated

<?php // wrap every 3 divs in a row

     if(get_field('triple_column_2')): ?>

     <?php while(has_sub_field('triple_column_2')):  ?>

            <div class="col-sm-4">
              <?php the_sub_field('copy'); ?>
            </div>

      <?php endwhile; ?>

     <?php endif; ?>

推荐答案

您可以以此为起点。我还没有测试过，因此我的逻辑中可能会出现一些小问题，但这将带您到达大部分（如果不是全部的话！）。

You can use this as a starting point. I haven't tested it so there might be slight problems in my logic, but this will get you most of the way there (if not all the way!).

if ( get_field( 'triple_column_2' ) ): ?>

    <?php $index = 1; ?>
    <?php $totalNum = count( get_field('triple_column_2') ); ?>

    <row>
    <?php while ( has_sub_field( 'triple_column_2' ) ): ?>


        <div class="col-sm-4">
            <?php the_sub_field( 'copy' ); ?>
        </div>
        <? if ($index % 3 == 0) : ?>
            <? if ($index < $totalNum) : ?>
                // more rows, so close this one and start a new one
                </row>
                <row>
            <? elseif ($index == $totalNum) : ?>
                // last element so close row but don't start a new one
                </row>
            <? endif; ?>

        <? endif; ?>

    <?php $index++; ?>
    <?php endwhile; ?>

<?php endif; ?>

这篇关于WordPress高级自定义字段中继器，每3个div换行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！