Advanced Custom Fields（ACF）

概要

Advanced Custom Fields（ACF）とは、WordPressの投稿・固定ページなどに、用途に合わせたカスタムフィールドを追加・管理できるWordPressプラグインです。テキスト、画像、選択肢などの入力項目を「フィールドグループ」として設計し、条件に応じて編集画面へ表示できます。[1][2][7]

WordPress本体にも「カスタムフィールド（post meta）」の仕組みがあります。[4] ACFはその仕組みを利用しやすい管理画面とAPIを提供し、Webサイトで扱う情報を構造化して管理しやすくします。[1]

用語

読み方

分類

主な用途

代表的な仕組み

Advanced Custom Fields（ACF）

アドバンスト カスタム フィールズ

WordPressプラグイン

WordPressの入力項目・構造化データを拡張

フィールド、フィールドグループ、Location Rules、API

Advanced Custom Fields（ACF）とは

WordPressの入力項目を用途に合わせて増やすプラグイン

通常のWordPressでは、投稿タイトル、本文、アイキャッチ画像などの基本的な入力欄を使ってコンテンツを作成します。

一方、企業サイトでは次のような「本文とは分けて管理したい情報」がよくあります。

  • 事例の業種
  • 商品価格
  • 店舗住所
  • スタッフの役職
  • セミナー開催日
  • 施設の設備情報
  • 資料PDF
  • 外部リンク
  • 選択式のステータス

ACFを利用すると、こうした情報をそれぞれ専用の入力項目として用意できます。公式ドキュメントでは、ACFをWordPressの編集画面へ追加のコンテンツフィールドを追加するプラグインとして説明しています。[1]

WordPress本体のカスタムフィールドとの関係

WordPressには投稿に追加情報を保存するpost metaの仕組みがあり、WordPress Developer Resourcesでも、post metaが管理画面上では「Custom Fields」と呼ばれることが説明されています。[4]

WordPressのCustom FieldsはWordPress本体に備わる仕組みで、ACFは表示するフィールドや入力UI、表示条件を設定しやすくします。[1]**[4]

フィールドグループとは

複数のフィールドをひとまとまりにする

ACFでは、複数のカスタムフィールドを「フィールドグループ」としてまとめます。

公式ドキュメントでは、フィールドグループには次の要素が含まれると説明されています。[2]

  • グループのタイトル
  • 各フィールド
  • Location Rules
  • 表示に関する設定

例えば「導入事例」というカスタム投稿に、

  • 業種
  • 課題
  • 導入サービス
  • 公開年月
  • ロゴ画像

を持たせたい場合、これらをひとつのフィールドグループとして作成できます。

Location Rulesで表示先を決める

Location Rulesは、そのフィールドグループをWordPress管理画面のどこに表示するかを決める条件です。[2]**[8]

例えば、

  • 特定の投稿タイプを編集するとき
  • 特定のページテンプレートを使っているとき

など、コンテンツに応じて必要な入力項目だけを表示できます。

これにより、更新担当者が「このページではどの情報を入力すればよいか」を理解しやすい管理画面を作れます。

ACFのフィールド

ACFには、さまざまなデータを入力するためのフィールドタイプがあります。公式のResource Centerでは、テキスト、画像、選択項目、日付、URL、Relationship、Post Objectなど多数のフィールドタイプが案内されています。[7]

用途に応じて例えば次のように使い分けます。

管理したい情報

フィールドの例

短い文字情報

Text

長文

Textarea / WYSIWYG

画像

Image

選択肢

Select / Radio Button / Checkbox

日付

Date Picker

URL

URL

真偽値

True / False

他の投稿との関連

Relationship / Post Object

同じ「文字を入力する情報」でも、URLならURL専用、日付なら日付専用のフィールドを使うことで、入力方法やデータの扱いを統一しやすくなります。

ACFの値をWebサイトに表示する

get_field() で値を取得する

ACFには、登録したフィールドの値を取得するためのAPIがあります。

代表的な get_field() は、指定したフィールドの値を取得する関数です。公式ドキュメントでは、フィールド名またはフィールドキーを指定し、必要に応じて対象の投稿IDを指定できると説明されています。[3]

例えば、company_name というフィールドを作成した場合、テーマ側では次のように値を取得できます。

$company_name = get_field('company_name');

出力時にはエスケープを考える

ACFの get_field() 公式ドキュメントでは、取得した値を出力する際には、内容に応じた適切なエスケープ処理を行うよう注意が記載されています。[3]

値が文字列なのかURLなのかHTMLを含むのかによって、使うエスケープ関数は異なります。

ACFを使うこと自体が、表示時のセキュリティ処理を不要にするわけではありません。テーマやプラグイン側で、出力するデータの種類に合わせて扱います。

カスタム投稿タイプとの違い

カスタムフィールドとカスタム投稿タイプは役割が異なります。

  • カスタム投稿タイプ：どの種類のコンテンツを管理するかを定義する
  • カスタムフィールド：そのコンテンツにどの追加情報を持たせるかを定義する

例えば「スタッフ」を独立したコンテンツとして管理するなら「スタッフ」というカスタム投稿タイプを作り、その中に「役職」「所属」「プロフィール写真」などのカスタムフィールドを追加する設計が考えられます。

現在のACFはカスタムフィールドだけでなく、管理画面からカスタム投稿タイプやカスタムタクソノミーを登録する機能も提供しています。ACF公式は、この機能をACF 6.1から提供していると説明しています。[5]

ただし、カスタム投稿タイプとカスタムフィールドの概念上の役割が同じになるわけではありません。サイトの情報設計に合わせて使い分けます。

ACF PROとの違い

ACFには無料版とPRO版があり、一部の高度なフィールドや機能はPROで提供されています。

例えば、同じ構造の入力欄を必要な数だけ繰り返せる「Repeater」フィールドは、ACF公式ドキュメントでACF PROの機能として案内されています。[6]

そのため、サイト設計時には「必要な入力項目が無料版で足りるか」「繰り返し構造や高度なコンテンツ設計が必要か」を確認します。

ACFを使うメリット

更新担当者が決まった形式で入力できる

本文エディターへ毎回自由形式で情報を書かせるのではなく、「価格」「日付」「URL」「画像」など項目を分けることで、入力形式を統一しやすくなります。

表示とデータを分けて設計しやすい

データを専用フィールドに保存しておけば、テーマ側で表示位置やデザインを変更しても、登録済みのデータを再利用しやすくなります。

例えば店舗住所を専用フィールドにしておけば、詳細ページだけでなく一覧、地図、構造化データなど別の表示にも利用できます。

管理画面を用途に合わせて設計できる

Location Rulesを利用し、必要なページ・投稿タイプにだけ必要なフィールドを表示できるため、更新担当者向けの管理画面を整理できます。[2]

ACFを導入するときの注意点

フィールド設計を先に考える

フィールドを増やすこと自体は簡単ですが、似た意味のフィールドが乱立すると管理しにくくなります。

実装前に、

  • 何を1件のコンテンツとして扱うか
  • 一覧で必要な情報は何か
  • 詳細ページで必要な情報は何か
  • 将来検索・絞り込みに使う情報は何か
  • 値を他の画面でも再利用するか

を整理してからフィールドを設計すると、後からの変更を抑えやすくなります。

表示側の実装も必要

ACFでフィールドを作るだけでは、サイト上の希望する位置へ自動的にすべて表示されるわけではありません。

テーマ・テンプレート側で get_field() などを利用し、どの値をどこに表示するか実装するのが一般的です。[3]

そのためACFは、「管理画面で項目を作る部分」と「フロントエンドで表示する部分」をセットで設計します。

関連用語

一覧へ戻る

Contact us

『ホームページ制作の相談をしたい』『もっとたくさん商品を売りたい』等、ご要望をお伝えくださいませ。

疑問に思っていること、お困りごと、具体的な内容が未定でも、まずはお気軽にご相談くださいませ。

Faq

Contact Us