WordPress Smart Custom Fields - Webデザイン・プログラミングオンライン個別指導のAkros

今回はWordPress案件で利用する機会のあったWordPressのカスタムフィールドプラグイン
Smart Custom Fieldsをご紹介したいと思います。
カスタムフィールドについては新橋校の田中先生の「WordPress投稿一覧にカスタムフィールドの値を取得表示させる」や札幌校蛇谷先生の「WordPressのカスタムフィールドってどうしてる？」でも説明されていますのでそちらをご覧ください。

Smart Custom Fields

WordPressのプラグインでカスタムフィールドを管理画面から簡単に作成できます。
Advanced Custom Fieldを利用している方も多いと思いますがAdvanced Custom Fieldだと有料の繰返しを無料で利用することができます。
入力項目の数が決まっていない時などはこの繰返しで処理できるので便利ですね。

Smart Custom Fieldsの利用手順

インストールして有効化する
カスタムフィールドを設定する
必要であれば繰返し機能利用したカスタムフィールドを設定する
カスタムフィールドの内容を表示したい箇所のテンプレートに値を出力するためのコードを記述する

インストールと有効化

通常のプラグインと同様に「プラグイン」→「新規追加」から「Smart Custom Fields」を検索してインストール後有効化します。
※ダウンロードしてFTPアップでもOKです。
有効化するとメニューバーにSmart Custom Fieldsのメニューが追加されます。

カスタムフィールドを設定する

Smart Custom Fieldsのメニューから新規追加
カスタムフィールド管理用の名前を入力
フィールド追加ボタンからフィールドを追加
タイプからカスタムフィールドの種類（テキストエリア、ラジオボタン、セレクトボックス等）を選びます。
カスタムフィールドの名前を入力（半角英数です、値の出力時に使用）
カスタムフィールドのラベルを入力（入力項目の名前ななので、わかりやすく）

繰り返しを設定する

Advanced Custom Fieldの繰返しと同じような機能になります。
項目数が決まらない項目がある場合は設定します。
基本的な手順は上記と同じですが、繰り返しにチェックを入れてサブフィールドで追加をしてください。

カスタムフィールドの内容を出力する

カスタムフィールドの項目が設定できたら、投稿画面よりカスタムフィールドの項目含め必要事項を入力して投稿しておきます。
後はカスタムフィールドの内容を表示したい箇所のテンプレートに値を出力するためのコードを記述する

値を出力するためのコードサンプル

[html title=”値の取得”] <?php
$cf_name = SCF::get(‘cf_name’);
?>
[/html] 上記はSmart Custom Fields専用の値を取得するコードです。
カスタムフィールドの名前が「cf_name」の値を$cf_nameに格納する記述になります。
[html title=”値の出力”] <?php
$cf_name = SCF::get(‘cf_name’);
echo $cf_name;
?>
[/html]

繰返しのフィールドのコードサンプル

[html title=”値の取得と表示”] <?php
$cf_sample = SCF::get(‘cf_sample’);
foreach ($cf_sampel as $field_name => $field_value ) {
echo $field_value[‘cf_name’];
echo $field_value[‘cf_tel’];
}
?>
[/html] フィールドのグループ名が「cf_sample」で、カスタムフィールドの名前が「cf_name」と「cf_tel」の2つの場合の記述です。
繰り返しでグループ化したカスタムフィールドの中身をforeachで回して出力しています。