【ACF設定編】初心者必見！今どきのカスタムフィールド【WordPress】

皆さんWordPressでカスタムフィールドというものを使っていますか？？

簡単に言うと編集画面に入力欄を用意して、入力したテキストや画像を公開側に表示するものになります。

「入力欄ならエディタが編集ページにあるよ？」と思われると思いますが、
例えばイベントの表の定型文を毎回同じコピペして使っていると、毎回コピーする事が面倒になります。

また、デザインを崩さずにテキストだけ変えたいんだ！
クライアント様が変更後→崩れた！みたいなことがよくあります。そういった問題を解決してくれます。

設定が終わっている方は実践編（基本フィールド）を御覧ください。

編集画面のサンプル例

以下の画像がサンプルのイベント用カスタムフィールドを入力する画面になります。

入力欄に入力するだけなので、定型文をコピペせずに済み、またデザインを損なわずに内容だけ変えることができます。

カスタムフィールドの定番プラグインAdvanced Custom Fields

Advanced Custom Fields（以下略ACF）は2200万以上のダウンロードを誇る圧倒的人気を誇るカスタムフィールドプラグインです。

他にもカスタムフィールドのプラグインはありますが、ACFの多機能ぶりにはまだまだ遅れを取っている状況です。

最新のACF（2021/8/5時点）を使用するにはWordpressのバージョンが4.7以上、またPHPのバージョン5.6以上が必須になります。

ACFのインストール

以下の手順でインストールします。

1. 左メニューのプラグインの「新規追加」
2. Advanced Custom Fieldsを検索
3. 「今すぐインストール」→「有効化」

フィールドグループを作成する

プラグインをインストールして有効化すると左のメニューに「カスタムフィールド」という項目が追加されるので、
フィールドグループ→新規追加の順でフィールドのグループを作成します。

このフィールドグループ内（個々のフィールドを入れる箱のようなもの）に任意のフィールドを登録して、固定ページ、投稿、カスタム投稿の編集画面にフィールドを表示するように設定していきます。

フィールドの作成

1. フィールドグループの名前を任意で入力します。
2. フィールドグループを設置する編集ページを指定します。今回はカスタム投稿の「お知らせ」の編集ページに設置するように設定します。
3. 「フィールドを追加」より各フィールドを追加します。

フィールドを追加すると空のフィールド(no label)が展開されるので、各項目を設定して1つのフィールドを作成していきます。詳しくは後述します。

また、複数のフィールドを登録する場合は再度「フィールドを追加」から追加します。

フィールドの詳細設定

フィールドを追加すると「(no label)」というフィールドが表示されるのでクリックすると詳細な設定画面が展開されます。

まとめ

今回はACFの初期設定をお話しました。

ACFはカスタムフィールドの大定番のプラグインで、筆者もいつも使用しています。
カスタムフィールドを使うと仕事の幅が広がりクライントの要望をより多く叶えることができます。
この機会に、よりクライアントファーストなWordPressを構築してみませんか？

次回から実践編をコピペで実装する手順を解説したいと思います。