15. カスタムフィールド

この章では、カスタムフィールドを学びます。

カスタムフィールドは、投稿や固定ページに本文以外の情報を持たせる仕組みです。

実務では、更新しやすさと表示崩れを防ぐために重要になります。

カスタムフィールドとは

カスタムフィールドは、投稿や固定ページに追加できる入力項目です。

たとえば、制作実績で次のような情報を管理できます。

• クライアント名
• 制作年
• サイトURL
• 担当範囲
• 業種
• 使用技術

本文に自由入力することもできますが、項目として分けるとテンプレートで扱いやすくなります。

どんな時に使うか

カスタムフィールドは、決まった形式の情報を管理したい時に向いています。

毎回同じ形式で入力したい情報は、フィールド化すると管理しやすくなります。

本文とフィールドの使い分け

本文に入れるか、フィールドに分けるかは、更新しやすさと表示の安定性で判断します。

本文に向いているもの:

• 自由な文章
• 長い説明
• 画像を含む紹介文
• ブロックエディターで編集したい内容

フィールドに向いているもの:

• 日付
• 金額
• URL
• 担当範囲
• 選択肢から選ばせたい情報
• 一覧でも詳細でも使う情報

フィールド化しすぎると入力欄が増えて大変になります。

必要な項目に絞ります。

ACFなどのプラグイン

カスタムフィールドは、プラグインを使って管理することが多いです。

代表的なものにACFがあります。

プラグインを使うと、テキスト、画像、日付、選択、繰り返しなどの入力欄を作りやすくなります。

ただし、プラグインに依存するため、更新、互換性、保守も考える必要があります。

テンプレートで出力する

カスタムフィールドの値は、テンプレートで取得して表示します。

プラグインによって関数は変わりますが、考え方は同じです。

<?php
$site_url = get_post_meta( get_the_ID(), 'site_url', true );
?>

<?php if ( $site_url ) : ?>
    <a href="<?php echo esc_url( $site_url ); ?>" target="_blank" rel="noopener noreferrer">
        サイトを見る
    </a>
<?php endif; ?>

値が空の場合の表示も考えます。

URLならesc_url()、テキストならesc_html()のように、出力内容に合わせてエスケープします。

入力しやすさを考える

カスタムフィールドは、制作者にとって便利なだけでは不十分です。

クライアントが入力しやすいことも大切です。

意識したいことは次の通りです。

• 入力項目を増やしすぎない
• 項目名をわかりやすくする
• 入力例を用意する
• 選択式にできるものは選択式にする
• 必須項目を明確にする
• 空欄でも表示が崩れないようにする

管理画面の使いやすさは、運用品質に直結します。

表示崩れを防ぐ

自由入力が多いと、ページごとに見た目がばらつくことがあります。

たとえば、料金、開催日、リンクURLなどはフィールド化すると表示を安定させやすくなります。

テンプレート側でHTML構造を固定し、入力内容だけを差し替えるイメージです。

よくある失敗

• 何でもカスタムフィールドにして入力が大変になる
• フィールド名がわかりにくい
• 空欄の時にテンプレートが崩れる
• URLやテキストをエスケープせずに出力する
• プラグインを外すと表示に影響することを考えていない

カスタムフィールドは便利ですが、設計しすぎても運用しづらくなります。

必要な情報に絞って使います。

この章のまとめ

• カスタムフィールドは、投稿や固定ページに追加情報を持たせる仕組み
• 日付、URL、金額、担当範囲など決まった形式の情報に向いている
• 本文とフィールドは、自由度と表示安定性で使い分ける
• ACFなどのプラグインを使うと入力欄を作りやすい
• クライアントが入力しやすい項目設計を意識する