Advanced Custom Fieldsのカスタムフィールド入力値の出力や利用の方法

2019年1月17日

Advanced Custom Fieldsの設定画面は日本語にも対応していますし、UI自体がとてもわかりやすく出来ています。初心者の方が初めてインストールしても、割合スムースにカスタムフィールドの作成ができるのではないかと思います。
しかし!!フィールドを作って、そこに入力しただけはどこにも表示されませんし、表面上は何も変化が起きません。一生懸命カスタムフィールドを作成したけど、実際に入力値を利用できずに「なんなんじゃい!」と諦めてしまう方もいるのではないかと思います。

そこで、今回はAdvanced Custom Fieldsのカスタムフィールドに入力した値を実際に出力したり利用する方法について書いてみたいと思います。

※この記事の内容は、PHPの基本的な文法がわからないと、理解しにくい部分が含まれます。

カスタムフィールドの入力値はメタデータ

カスタムフィールドに入力した値は、メタデータとして追加されます。メタデータというのは、表面上は見えませんがページにデータを添付してあるイメージです。添付しただけでは表示されませんよね。これを利用するには、ページで使用されているテンプレート内で値を取り出さなければいけません。

ワードプレスでメタデータを取得するには、get_post_meta()get_post_custom() といった関数を使います。しかし、Advanced Custom Fieldsでは、値の取り出し用の関数が用意されていますので、今回はこちらを使用します。

フィールドの入力値の取得方法

Advanced Custom Fieldsのカスタムフィールドの値の取得は、以下の2つの関数を使います。

get_field()

指定した1つのカスタムフィールドの値を取得します。

取得して出力するコードの例

出力するだけ良い場合

単独のカスタムフィールドの値を、シンプルに出力するだけで良い場合は、the_field()という関数も用意されています。echo get_field()と同じ事をしてくれます。

という事で、下の2行は同じ結果になります。

get_fields()

すべてのカスタムフィールドを全てまとめて取得します。

テンプレートの先頭で、下のように記述しておけば、好きな箇所ですべてのカスタムフィールドの値が利用できるようになります。

いったん任意の名前の配列(上の例ではfieldData)に格納します。
そして利用する時は、下のように配列のキーにフィールド名を指定します。

カスタムフィールドのタイプによっては、さらに中身が配列になっている場合もありますが、基本的にこんな感じで簡単に取り出せます。上は例としてDLを使用していますが、TABLEを使用すればカスタムフィールドの値を使用して自動的に生成される表を作る事もできますね。

最後に

取得して利用するのもとってもカンタンですね。

あまり使わないので本文中で省略してしまいましたが、get_field() も get_fields() も、最後のパラメータにfalseとすると、フォーマットしない状態の生データで取得できるようです。

文中にも書きましたが、フィールドタイプによって返り値が配列だったりする場合もあるので、イレギュラーのあるフィールドタイプについては別の機会にまとめたいと思います。

参考サイト

ACFの公式サイトの関数の一覧です。英語ですが気になる方はどうぞ。

https://www.advancedcustomfields.com/resources/#functions

関連のある記事

ACFのカスタムフィールドをクイック編集できるプラグイン「ACF Quick Edit Fields」

ACFのカスタムフィールドをクイック編集できるプラグイン「ACF Quick Edit Fields」

記事を読む

Advanced Custom Fieldsでセレクトボックスなどの選択肢を動的に設定する方法

Advanced Custom Fieldsでセレクトボックスなどの選択肢を動的に設定する方法

記事を読む

Advanced Custom Fieldsでチェックボックスの作成と値の利用方法【ワードプレス】

Advanced Custom Fieldsでのチェックボックスの作成と値の利用方法【ワードプレス】

記事を読む

Advanced Custom Fieldsでラジオボタンを作成し値を出力する方法

Advanced Custom Fieldsでラジオボタンを作成し値を出力する方法

記事を読む

Advanced Custom Fieldsのフィールドグループの作成・設定方法

Advanced Custom Fieldsのフィールドグループの作成・設定方法

記事を読む


目次へ
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages