こんにちは、shimamisaです。
以前、Smart Custom Fieldsの基本的な使い方をご紹介しましたが、
今回は、便利な「繰り返し機能」の使い方と、フィールドタイプの出力方法について、ご紹介していきます。実務で使用したコードで解説していきます。
私自身の備忘録も兼ねて、画像付きで分かりやすく書いていきます！
Smart Custom Fields 繰り返し機能とは
はじめに「繰り返し機能」とは、設定したカスタムフィールドを、必要に応じて繰り返し使える機能になります。そのままですね(><;)習うより慣れろで、実際に使ってみた方が良いですね！
投稿時に、カスタムフィールドを追加・削除・移動ができるので、表示する項目が決まっておらず、時と場合に応じて自由に増減したい！という方にはぴったりの機能だと思います。
繰り返し機能の使い方
仕組みを理解すれば、他の場面にも応用できると思います！
また、当記事ではプラグインのインストール方法は割愛しています。インストール方法が不安という方は、こちらの記事を参考にしてみてください。
それでは、作成していきましょう。
カスタムフィールドグループを作成
はじめに、カスタムフィールドグループを作成します。
「新規追加」をクリックします。
そうすると、下記の画面が表示されるので、「タイトルを追加」にカスタムフィールドグループ名を入力します。
ここでは、「アパート詳細」にします。
繰り返しのカスタムフィールドを作成
つづいて、カスタムフィールドを作成します。
上記の青色の「フィールドを追加」ボタンをクリックすると、下記の画面が表示されます。
ここから、繰り返し機能を使い、投稿者が項目タイトルと項目内容を、自由に入力できるようにしていきます。「繰り返し」をクリックします。
「繰り返し」をクリックすると、下記の画面が表示されるので、グループ名を入力します。
ここでは、「free_item」にします。
「free_item」というグループの中に、カスタムフィールドを作っていきます。
カスタムフィールドは、それぞれ下記のようにしました。
タイプ：テキスト
ラベル：項目タイトル
名前：add_title
タイプ：テキストエリア
ラベル：項目内容
名前：add_contents
行：3
入力後は、下記のようになります。
「free_item」というグループの中にカスタムフィールドを追加するときは、「サブフィールドを追加」をクリックします。
以上で、カスタムフィールドの作成は完了です。
投稿画面にはこんな感じで表示されます。
ここまで出来れば、あとは出力作業です！もうひとがんばりです！
出力方法
繰り返しを表示させたい箇所に下記のようなコードを書いていきます。
<?php
$free_item = SCF::get('free_item');
foreach ($free_item as $fields) {
?>
<tr>
<th><?php echo $fields['add_title']; ?></th>
<td><?php echo nl2br($fields['add_contents']); ?></td>
</tr>
<?php } ?>下記コードをコピペし、自分で決めた名称に置き換えてみてください。
<?php
$繰り返しのグループ名= SCF::get('繰り返しのグループ名');
foreach ($繰り返しのグループ名 as $fields) {
echo $fields['カスタムフィールド名'];
}
?> if文との組み合わせ
上記の書き方だと、投稿者が項目を追加しなかった時にも、空白が表示されてしまうかと思います。
追加項目がないときは、非表示にした方が見た目がスッキリすると思うのでif構文で条件分岐させましょう。
<?php
$free_item = SCF::get('free_item');
foreach ($free_item as $fields) {
if($fields['add_title'] !== "" and $fields['add_contents']!== ""){
?>
<tr>
<th><?php echo $fields['add_title']; ?></th>
<td><?php echo nl2br($fields['add_contents']); ?></td>
</tr>
<?php
}
}
?>ちょこっと解説
foreach文の中に、if文を挿入しています。
項目タイトル（add_title）と、項目内容（add_contents’）が空（””）でなければ（つまり、入力されている時ですね！）、項目タイトルと項目内容を出力する。それ以外は出力しない。という条件になります。
検索すると、他の書き方が紹介されていたのですが、私の場合上手くいかず・・・
上記の方法だと上手くいきました。
フィールドタイプごとの出力方法
よく使うカスタムフィールドのタイプごとに出力方法をご紹介します
if文で条件分岐をさせると、様々な使い方ができるのでとても便利ですよね。
どなたかのご参考になれば嬉しいです。
テキスト
1行のテキストが入力できます。
カスタムフィールドの名前は、「text」とします。
<?php
$text= SCF::get( 'text' );
echo $text;
?>
<!-- pタグなどで囲むと、cssで装飾できます -->
<?php $text = SCF::get('text'); ?>
<p><?php echo $text; ?></p>テキストエリア
複数行のテキストを入力できます。
カスタムフィールドの名前は、「textarea」とします。
<?php
$textarea = SCF::get('textarea');
echo ($textarea);
?>
<!-- 改行を適用させたい時 -->
<?php
$textarea = SCF::get('textarea');
echo nl2br($textarea);
?>
画像
画像をアップロードできます。
カスタムフィールドの名前は、「img」とします。
<?php
$img = SCF::get('img');
echo wp_get_attachment_image( $img , 'large' );
?>「large」のところは、画像の大きさを表します。他に、thumbnail, medium, large, fullを使うことが出来ます。
画像の繰り返し
アップロードする画像の枚数が決まっていない時などに、繰り返し機能を使います。
テキストの繰り返し出力と同様に、foreachを使います。
繰り返しのカスタムフィールドグループ名は「imgGroup」、カスタムフィールド名を「img1」とします。
<?php
$imgGroup = SCF::get('imgGroup');
foreach ($imgGroup as $fields) {
$imgurl = wp_get_attachment_image_src($fields['img1'] , 'large');
?>
<div>
<!-- 画像がない時はnoImg画像を表示 -->
<?php if($fields['img1'] === "" ) {?>
<img src="<?php echo get_template_directory_uri(); ?>/img/noImage.jpg">
<!-- それ以外（画像がある時）画像を表示 -->
<?php } else { ?>
<img src="<?php echo $imgurl[0]; ?>" >
<?php
}
?>
</div>
<?php } ?>
if文内はご自由に書き換えてみてください！
チェックボックス
選択肢から複数を選択することができます。
カスタムフィールドの名前は、「checkBox」とします。
<?php
$checkBox = SCF::get('checkBox');
foreach ($checkBox as $field) {
echo $checkBox;
}
?>ラジオボタンの出力方法
選択肢から一つだけ選択することができます。
カスタムフィールドの名前は、「radioButton」とします。
<?php
$radioButton = SCF::get('radioButton');
echo $radioButton;
?>ファイルの出力方法
PDFなどのファイルをアップロードできます。
カスタムフィールドの名前は、「file」とします。
<?php
$file = SCF::get('file');
$file = esc_url(wp_get_attachment_url($file));
echo $file;
?>まとめ
繰り返し機能についてと、フィールドタイプごとの出力方法についてご紹介しました。
フィールドタイプは他にもあり、さまざまな状況で使えると思います。
プラグインの使い過ぎは良くありませんが、 Smart Custom Fieldsは、構築する側にとっても、投稿者にとっても楽にしてくれるプラグインだなと感じました。
以上です(^^)
