ACFのフィールド出力方法まとめ

Wordpress

投稿やカテゴリーに入力欄を追加することができる便利な「Advanced Custom Fields」というプラグイン。
出力の方法次第で連番を振ることや、ループの内容の引き継ぎ、ループの分岐ができるのを知っていますか？
今回は、Advanced Custom Fields（以下ACF）の出力方法をまとめて解説します！

ACFの使い方についてはこちら

コーディング

2021.11.25

ACFのフィールド出力方法まとめ

投稿やカテゴリーに入力欄を追加することができる便利な「Advanced Custom Fields」というプラグイン。出力の方法次第で連番を振ることや、ループの…

基本のコンテンツの出力

まずは基本のコンテンツの出力方法です。
フィールドのスラッグを入れることで入力内容を表示させることができ、if文を使うことで入力の有無で表示の出し分けをすることもできます。

<!-- 入力内容を表示 -->
<div class="item"><?php the_field('フィールドのスラッグ'); ?></div>

<!-- 入力があった場合、入力内容を表示 -->
<?php if(get_field('フィールドのスラッグ')): ?>
	<div class="item"><?php the_field('フィールドのスラッグ'); ?></div>
<?php endif; ?>

グループの出力

フィールドを多く作成する必要がある場合、ただフィールドを沢山作成するだけでは管理が難しくなってしまう場合があります。
そのときに役立つのが「グループ」です。
グループにすることで、複数のフィールドを1グループとして管理することができます！

便利な機能ですが、出力方法は通常のフィールドと異なり、グループの指定をする必要があるため注意が必要です。

<?php
$group_name = get_field('グループのスラッグ');	
if( $group_name ): ?>
		<!-- グループの内容ここから -->
		<?php echo $group_name['グループ内のフィールドのスラッグ']; ?>
		<!-- グループの内容ここまで -->
<?php endif; ?>

繰り返しフィールドの出力

基本の出力方法に続いて、PRO版で使うことのできる繰り返しフィールドの出力方法です。
繰り返しフィールドは出力の方法次第で連番を振ることや、ループの内容の引き継ぎ、ループの分岐をすることができます！

繰り返しフィールドについてはこちら

コーディング

2021.11.25

ACFのフィールド出力方法まとめ

投稿やカテゴリーに入力欄を追加することができる便利な「Advanced Custom Fields」というプラグイン。出力の方法次第で連番を振ることや、ループの…

基本の出力方法

繰り返しフィールドの基本の出力方法はwhile文を使用したループの中に記述します。
通常の出力がthe_fieldなのに対し、the_sub_fieldで出力をするため注意が必要です。
表示が上手くされないときにはまずフィールドの記述を確認してみてください！

<?php if(have_rows('繰り返しフィールドのスラッグ')): ?>
	<?php while(have_rows('繰り返しフィールドのスラッグ')): the_row(); ?>
		<!-- 繰り返しフィールドの内容ここから -->
		<?php the_sub_field('サブフィールドスラッグ'); ?>
		<!-- 繰り返しフィールドの内容ここまで -->
	<?php endwhile; ?>
<?php endif; ?>

他のページに出力させる場合

繰り返しフィールドに限らず、カスタムフィールドの内容は作成したページではない他のページに出力をさせることができます。
例として下記は固定ページに作成した繰り返しフィールドの出力方法です。
最初に固定ページのスラッグを指定することで、他の繰り返しフィールドと同じような記述で出力をさせることができます。

<?php
$page_id = get_page_by_path('固定ページのスラッグ');
$page_id = $page_id->ID;
?>
<?php if(have_rows('繰り返しフィールドのスラッグ', $page_id)): ?>
	<?php while(have_rows('繰り返しフィールドのスラッグ', $page_id)): the_row(); ?>
		<!-- 繰り返しフィールドの内容ここから -->
		<?php the_sub_field('サブフィールドのスラッグ'); ?>
		<!-- 繰り返しフィールドの内容ここまで -->
	<?php endwhile; ?>
<?php endif; ?>

連番を振って出力

繰り返しフィールドを使用する場合、繰り返しの何番目のコンテンツなのかの数字を出力させることができます。
通常は「1.2.3…」のように出力されますが、sprintf("%02d",$count);の記述を書くことで「01.02.03…」のように頭に「0」を付けることも可能です！

<?php if(have_rows('繰り返しフィールドのスラッグ')): ?>
    <?php $count=1; ?>
    <!-- 数字を01にしたい場合は下記を記述 -->
    <?php $count = sprintf("%02d",$count); ?>
    <?php while(have_rows('繰り返しフィールドのスラッグ')): the_row(); ?>
        <!-- 繰り返しフィールドの内容ここから -->
        <?php the_sub_field('サブフィールドスラッグ'); ?>
        <!-- echo $count で連番を出力 -->
        <?php echo $count; ?>
        <!-- 繰り返しフィールドの内容ここまで -->
        <?php $count++; ?>
        <?php $count = sprintf("%02d",$count); ?>
    <?php endwhile; ?>
<?php endif; ?>

特定回数で条件分岐

一つ前の連番の出力の方法を応用することで、フィールドの回数によってif分岐をさせることもできます。
if文と組み合わせることで、6件目までは大きく表示、それ以降は小さく表示などコンテンツが増えた場合の分岐処理を行うことができます。
また、記述を工夫することで5件ごとに<div>タグを挟むなど細かいタグの調整をすることもできます！

<?php if(have_rows('繰り返しフィールドのスラッグ')): ?>
    <?php $counter = count(get_field('繰り返しフィールドのスラッグ')); ?>
    <?php while(have_rows('繰り返しフィールドのスラッグ')): the_row(); $i++;?>
        <?php if( $i < 7 ): ?>
            <!-- 6件目までの処理 -->
            <!-- 繰り返しフィールドの内容ここから -->
            <?php the_sub_field('サブフィールドのスラッグ'); ?>
            <!-- 繰り返しフィールドの内容ここまで -->
        <?php endif; ?>
    <?php endwhile; ?>
    <?php if ( $counter > 7 ): ?>
        <!-- 7件目以降の処理 -->
        <?php while(have_rows('繰り返しフィールドのスラッグ')): the_row(); $t++;?>
            <?php if( $t < 7 ): ?>
            <?php else: ?>
            <!-- 繰り返しフィールドの内容ここから -->
            <?php the_sub_field('サブフィールドのスラッグ'); ?>
            <!-- 繰り返しフィールドの内容ここまで -->
            <?php endif; ?>
        <?php endwhile; ?>
    <?php endif; ?>
<?php endif; ?>

親ループの中に子ループを出力

繰り返しフィールドは親ループの中に子ループを入れ、その中に孫ループを…とどんどん入れ子にすることができます。
入れ子にする上限はありませんが、やりすぎてしまうとどこのループの処理なのかわかりにくくなってしまうため、注意が必要です。

<?php if(have_rows('親フィールドのスラッグ')): ?>
    <?php while(have_rows('親フィールドのスラッグ')): the_row(); ?>
        <!-- 繰り返しフィールドの内容ここから -->
        <?php the_sub_field('親サブフィールドのスラッグ'); ?>
        <!-- 繰り返しフィールドの内容ここまで -->
        <div class="child_field">
        <?php if (have_rows('子フィールドのスラッグ')) : ?>
            <?php while (have_rows('子フィールドのスラッグ')) : the_row(); ?>
	            <!-- 繰り返しフィールドの内容ここから -->
	            <?php the_sub_field('子サブフィールドのスラッグ'); ?>
	            <!-- 繰り返しフィールドの内容ここまで -->
            <?php endwhile; ?>
        <?php endif; ?>
        </div>
    <?php endwhile; ?>
<?php endif; ?>

親ループのフィールドを子ループで出力

通常、親ループのサブフィールドは子ループの中に引き継ぐことはできないのですが、変数にフィールドの値を格納することで子ループの中にも親ループのサブフィールドを表示させることができます。
子ループでの出力はget_sub_fieldではなくecho $dummy部分のように値を格納した変数から出力します。

<?php if(have_rows('親フィールドのスラッグ')): ?>
    <?php while(have_rows('親フィールドのスラッグ')): the_row(); ?>
        <!-- 繰り返しフィールドの内容ここから -->
        <?php the_sub_field('親サブフィールドのスラッグ'); ?>
        <!-- 繰り返しフィールドの内容ここまで -->
        <!-- 出力させたい親サブフィールドの内容を変数に格納 -->
        <?php $dummy = get_sub_field('親サブフィールドのスラッグ'); ?>
        <div class="child_field">
        <?php if (have_rows('子フィールドのスラッグ')) : ?>
            <?php while (have_rows('子フィールドのスラッグ')) : the_row(); ?>
	            <!-- 繰り返しフィールドの内容ここから -->
	            <?php the_sub_field('子サブフィールドのスラッグ'); ?>
	            <!-- echo $dummy で親サブフィールドの内容を出力 -->
	            <?php echo $dummy; ?>
	            <!-- 繰り返しフィールドの内容ここまで -->
            <?php endwhile; ?>
        <?php endif; ?>
        </div>
    <?php endwhile; ?>
<?php endif; ?>