ACFの「リピーターフィールド」で複数データを効率的に管理する｜現場で使える実践テクニック

#ACF #WordPress #カスタムフィールド #クライアント更新 #リピーターフィールド
C
クリオ
Web制作ディレクター / フロントエンジニア

こんにちは！

今日は「ACFのリピーターフィールドで複数データを効率的に管理する」についてお話しします。

クライアント更新で「複数データ」の壁にぶつかった話

僕が初めてリピーターフィールドの必要性を感じたのは、実は けっこう後からなんです。
最初の頃は「単純なテキストフィールドとセレクトボックスで十分やん」って思ってました。
ほんまにそう思ってた。

でもある時、クライアントから「スタッフ紹介ページを作ってほしい」という依頼が来たんです。
スタッフが5人いて、各スタッフに対して「名前」「プロフィール」「写真」「資格」を登録できる仕様でした。
最初は「あ、単純に固定ページで5人分のフィールドを作ればいいな」くらいに考えてました。

ところがです。
後々「スタッフが10人に増えるかもしれない」「スタッフが辞めたら削除したい」という要件が出てきました。
その時に固定でフィールドを作ってしまっていた僕は、めっちゃ大変な思いをしました。
「なんで最初からリピーターにしておかなかったんだろう」って、ほんま後悔しましたね。

そこからが僕とリピーターフィールドの付き合いの始まりです。

リピーターフィールドの仕組みと基本的な使い方

リピーターフィールドとは何かを簡単に言うと、「同じ構造のデータを何個でも追加できるフィールド」です。
まるで、Excel の行を何行でも追加できるみたいなイメージですね。

ACF で リピーターを作る時の基本的な流れはこんな感じです：

  1. ACF で新しいフィールドグループを作成
  2. フィールドタイプを「Repeater」に設定
  3. その中に「子フィールド」（サブフィールド）を追加
  4. 投稿画面で「+行を追加」ボタンで何個でも増やせる

具体的な実装で言うと、さっきのスタッフ紹介ページの場合、こんな構成になります：

  • フィールドグループ名：「スタッフ情報」
  • リピーターフィールド名：「staff_list」
  • その中の子フィールド：
    • staff_name（テキスト）
    • staff_profile（テキストエリア）
    • staff_image（画像）
    • staff_qualification（テキスト）

フロントエンドでこれを表示する時の PHP コードはこんな感じになります：


if( have_rows('staff_list') ) {
  while( have_rows('staff_list') ) {
    the_row();
    $name = get_sub_field('staff_name');
    $profile = get_sub_field('staff_profile');
    // ここで出力処理
  }
}

ポイントは have_rows() と the_row()、そして get_sub_field() の3つの関数です。
これらを組み合わせることで、リピーター内のデータを一つずつ取得して処理できるわけです。

実装で気をつけるべき5つのポイント

1. 「フィールド名」は英字小文字＋アンダースコアで統一する

ACF の フィールド名を日本語にしちゃダメです。
僕も最初は「名前」「プロフィール」みたいに日本語で作ってしまったんですが、後から PHP で取得する時にめっちゃやりづらくなりました。
必ず staff_name みたいに英字で統一するといいですよ。

2. リピーター内での「画像フィールド」は「ID」で取得する

これ、ほんまによくハマるんです。
リピーター内で画像を取得する時は、フィールド設定の「返り値」を「画像 ID」にしておくと、後の処理が楽になります。
そうすれば wp_get_attachment_image_url() で URL を取得できるからです。

3. 「最大行数」を設定して無制限を防ぐ

現場でよく見るのは、リピーターを完全に無制限にしちゃう設定です。
確かに自由度は高いんですが、クライアントが100行とか登録しちゃう可能性だってあります。
ページの重くなったり、読み込み速度が落ちたりします。
だから、フィールド設定で「最大行数」を設定しておくといいですよ。
スタッフ紹介なら「最大20人」みたいな感じでね。

4. 「並び替え」を有効にしておくとクライアントが喜ぶ

ACF のリピーターは「並び替え可能」という設定があります。
これを有効にしておくと、投稿画面でドラッグ＆ドロップで行の順序を変えられるんです。
クライアントからすると「あ、簡単に順番を変えられるんだ」って すごく喜びます。
ほんでこれ、フロントエンドでは自動的に反映されるんで、追加実装も不要です。

5. リピーター内での「条件分岐」はif()ではなく ACF の「条件」機能を使う

例えば「資格がある場合のみ表示」みたいな条件分岐があるとします。
PHP での if() で処理することもできますが、むしろ ACF の設定画面で「条件」を設定しちゃう方が、クライアントのストレスが減ります。
「この子フィールドはこの条件の時だけ表示」みたいに設定できるんです。

まとめ

リピーターフィールドは、「複数のデータセットを効率的に管理したい」という場面で めっちゃ活躍します。
スタッフ紹介、商品ラインアップ、FAQ、ポートフォリオなど、使える場面は いっぱいあります。

最初は「リピーターって何？」って感じかもしれませんが、一度使うと「あ、こんなに便利なんだ」って思いますよ。
そして何より、クライアント更新がめっちゃ楽になります。
固定フィールドでカチカチに設定するのと違って、クライアント自身で「行を追加」「行を削除」できるから、修正依頼も減ります。

もし今、「複数データを管理できる仕様」を要件に入れるなら、ぜひ リピーターフィールドを活用してみてください。
初心者さんだと戸惑うかもしれませんが、試してみる価値は十分ありますよ。