技術メモ 読む時間 約2分

WordPressでカスタムフィールドを使って情報を追加 ( Advanced Custom Fields )

WordPressでカスタムフィールドを使って情報を追加 ( Advanced Custom Fields )

カスタムフィールドを使うと何ができる?

通常の「タイトル」・「本文」といった入力項目以外に任意の項目を追加し、保存・表示できるようになります。

Advanced Custom Fields プラグインを使用したカスタムフィールド

インストール&有効化が完了すると左に「カスタムフィールド」というメニューが表示されるのでそこから設定ページへ移動します。

「新規登録」からカスタムフィールドを設定します。ここで付けた「フィールド名」(この例では data1)を、あとで表示のときに使います。

投稿ページにテキスト入力ができる項目を追加したい場合は上記の設定だけ行い「公開」します。

投稿画面を表示させると先程追加した項目が編集画面に表示されるようになります。

カスタムフィールドの情報をページに表示させる方法

テーマのテンプレート(投稿のページなら single.php など)の、表示したい場所に次のコードを書きます。the_field() は Advanced Custom Fields の関数で、設定画面で付けたフィールド名を指定します。

<?php the_field('data1'); // フィールド名を指定 ?>

これで、投稿画面で入力したカスタムフィールドの値がページに表示されます。

注意:以前は「PHP Everywhere」というプラグインで記事の中に PHP を書く方法も紹介していましたが、このプラグインはセキュリティの問題で 2022 年に配布が終わっています。記事の中で PHP を動かす方法はおすすめしません。テンプレートに書く方法を使ってください。

※ 画面の画像は 2021 年時点のものです。今の Advanced Custom Fields では、メニューの名前や配置が変わっていることがあります。

この記事を書いた人

フリースタイル

Web の仕事 25 年以上。WordPress の保守・引っ越しと、PHP の業務の仕組みづくり。 プロフィール →

まずは、お気軽にご相談ください。

相談と見積りは無料です。急ぎのときは、フォームで「急ぎ」を選んでください。