Blog

ACFの繰り返しフィールドでn件目まで/以降を表示する方法

2021.07.27 WordPress

WordPressのACF(Advanced Custom Fields)を使うと、繰り返しフィールドを簡単に導入することができます。

<?php
	if(have_rows('フィールド名')):
	while(have_rows('フィールド名')): the_row();
?>

<?php the_sub_field("サブフィールド名"); ?>

<?php
	endwhile;
	else: endif;
?>

通常はテーマに上記のように記述して繰り返しフィールドを表示するわけですが、この書き方だとすべての繰り返しフィールドを同じソースコードで出力するため、以下のようなケースに対応できません。

  • 4件目までと5件目以降で表示する場所を分けたい
  • 1件目のみレイアウトやデザインを変えたい

ということで今回は、ACFの繰り返しフィールドで、n番目まで(または以降)を表示する方法についてご紹介します。

ACFの繰り返しフィールドでn件目まで/以降を表示する方法

ACFの繰り返しフィールドで4件目までを表示する方法

<?php
	if(have_rows('フィールド名')):
	while(have_rows('フィールド名')): the_row();
	$counter++; //繰り返しフィールドの件数をカウントする変数
?>

<?php if ($counter <= 4): //4件目までを表示 ?>

<?php the_sub_field("サブフィールド名"); ?>

<?php endif; ?>

<?php
	endwhile;
	else: endif;
?>

繰り返しフィールドの4件目までを取得して表示します。

ポイントは変数$counterを使って繰り返しフィールドの件数を取得することです。

詳しくは「後置加算子」とかで検索してみてください。

ACFの繰り返しフィールドで5件目以降を表示する

<?php
	if(have_rows('フィールド名')):
	while(have_rows('フィールド名')): the_row();
	$counter++; //繰り返しフィールドの件数をカウントする変数
?>

<?php if ($counter > 4): //4件目より後(=5件目以降)を表示 ?>

	<?php the_sub_field("サブフィールド名"); ?>

<?php endif; ?>

<?php
	endwhile;
	else: endif;
?>

同じ要領で5件目以降を取得して表示することができます。

「> 4」ではなく「>= 5」と書いても大丈夫です。

ACFの繰り返しフィールドで1件目と2件目以降で表示を変更する

<?php
	if(have_rows('フィールド名')):
	while(have_rows('フィールド名')): the_row();
	$counter_1st++; //繰り返しフィールドの件数をカウントする変数
?>

<?php if ($counter_1st == 1): //1件目のみ表示 ?>

	<?php the_sub_field("サブフィールド名"); ?>

<?php endif; ?>

<?php
	endwhile;
	else: endif;
?>

<?php
	if(have_rows('フィールド名')):
	while(have_rows('フィールド名')): the_row();
	$counter_2nd_onward++; //繰り返しフィールドの件数をカウントする変数
?>

<?php if ($counter_2nd_onward >= 2): //4件目より後(=5件目以降)を表示 ?>

	<?php the_sub_field("サブフィールド名"); ?>

<?php endif; ?>

<?php
	endwhile;
	else: endif;
?>

上記のようにすると1件目と2件目以降で分けられるので、たとえば1件目のみデザインやレイアウトを変更したいとか、2件目以降はアコーディオンで展開するようにしたいというときに使えます。

注意点としては、繰り返しフィールドの件数をカウントする変数を1件目と2件目以降で別のものにしておくことです。

上記の例では1件目を取得するソースでは「$counter_1st」という変数、2件目以降のソースでは「$counter_2nd_onward」としています(同一ページに表示する場合)。

これを両方「$counter」としてしまうと、2件目以降の際の$counterで1件目の$counterの値を上書きしてしまうことになり、意図したことができなくなります。

ACFの繰り返しフィールドで2件目から5件目までを表示する

<?php
	if(have_rows('フィールド名')):
	while(have_rows('フィールド名')): the_row();
	$counter++; //繰り返しフィールドの件数をカウントする変数
?>

<?php if ($counter >= 2 && $counter <= 5): //2件目から5件目を表示 ?>

	<?php the_sub_field("サブフィールド名"); ?>

<?php endif; ?>

<?php
	endwhile;
	else: endif;
?>

あまり必要になるケースが思い浮かびませんが、いちおう上記のようにすれば「n件目からm件目まで」という感じで切り取って表示することもできます。

まとめ

以上、ACFの繰り返しフィールドでn件目まで(または以降)を取得して表示する方法でした。

そこまで頻繁に使うことはないかもしれませんが、覚えておくと便利かと思います。