ACF リピーターフィールドの最初のサブフィールドの画像を表示

WordPress でコーポレートサイトを制作する際に必須のプラグイン Advanced Custom Fields。

そのACF の The Repeater Field (繰り返しフィールド)で画像ギャラリーを作成する際に最初の画像だけを取得して表示したい時ありますよね。

そんな時は最初の直を取得した後に “break” で繰り返しを中断してあげます。

そうすると最初の画像だけを表示する事ができます。

<?php if (have_rows('repeater')) : ?>
    <div>
        <?php while (have_rows('repeater')) : the_row();
            $subField = get_sub_field('subField');
        ?>
            <img src="<?php echo $subField['url']; ?>" alt="<?php echo $subField['alt'] ?>" />
            <?php break; ?>//最初のループが終わった後に break で中断
        <?php endwhile; ?>
    </div>
<?php endif; ?>

ループを再開する場合

次にループを再開する時に、上記の記述だと2周目のループからスタートしてしまうので、ループを最初に戻して再開したい場合は reset_rows() を使用してループをリセットします。

//最初のループ
<?php if (have_rows('repeater')) : ?>
    <div>
        <?php while (have_rows('repeater')) : the_row();
            $subField = get_sub_field('subField');
        ?>
            <img src="<?php echo $subField['url']; ?>" alt="<?php echo $subField['alt'] ?>" />
            <?php break; ?>//最初のループが終わった後に break で中断
        <?php endwhile; ?>
        <?php reset_rows(); ?>//ループをリセット
    </div>
<?php endif; ?>

//ループを再開
<?php if (have_rows('repeater')) : ?>
    <div>
        <?php while (have_rows('repeater')) : the_row();
            $subField = get_sub_field('subField');
        ?>
            <img src="<?php echo $subField['url']; ?>" alt="<?php echo $subField['alt'] ?>" />
        <?php endwhile; ?>
    </div>
<?php endif; ?>