Smart Custom Field(SCF)カスタムフィールドのチェックボックスで表示・非表示【WordPress】
人気記事【無料サポート付】サーバー開設からWordPressの始め方をサポート
カスタムフィールドを使って、入力した項目を画面上に表示・非表示にしたい場面があります。
入力した項目を消せば自動で非表示になるのですが、それだとまた項目内に再度入力したりと面倒ですよね。
これら入力項目を残した状態で、チェックボックスのオン・オフで一発切り替えできたら楽ですよね\(^^)/
それでは紹介していきます。
完成形は下記のようなイメージです。
販売状況によって「販売中」or「売り切れ中」と切り替えます。※クリックで画像が大きくなるよ
Smart Custom Field(SCF)カスタムフィールドのチェックボックスで表示・非表示する方法
まずは、Smart Custom Field(SCF)のプラグインをインストールします。細かい部分は割愛しますね。
- 「新規作成」→「パソコンカテゴリ」
- タイプを「真偽値」→デフォルトを「はい」
- TRUEラベルを「販売中」
- FALSEラベルを「品切れ中」
続いて「販売機種」や「値段」も設定していきましょう。
テキストを選択して、「名前※」にそれぞれ入力していきます。「販売機種」、「値段」、「台数」の3つですね。すべてテキストを選択しつつ名前だけ設定すれば問題ありません。
これで完成です。そしたら表示させたい固定ページのIDとチェックを入れます。画像を参考にしてみてください。
上記のようになればOKです。
実際にページを見に行くと下記のようになるので、好きな販売機種や値段、在庫を打ち込んで更新しましょう。
コードを入力する
続いて、該当ページに下記のコードを入力。SCFの書き方はここでは割愛します。
<?php
$model = SCF::get('販売機種',11);
$price = SCF::get('値段',11);
$stock = SCF::get('在庫',11);
?>
上記のように「名前※」と「ページID」を上記のように記載し、値を変数で取得します。
続いて、下記のようなマークアップを入力。
<p>販売機種は「」です。</p>
<p>現在の値段は「¥」です。</p>
<p>現在の在庫は「」台です。</p>
空白の部分を、先ほどの「$model」「$price」「$stock」をそれぞれ該当する部分に入力します。
<p>販売機種は「<?php echo $model; ?>」です。</p>
<p>現在の値段は「¥<?php echo $price; ?>」です。</p>
<p>現在の在庫は「<?php echo $stock; ?>」台です。</p>
画像で確認する
if文で表示・非表示にする
真偽値で設定する値はもともと「TRUE」「FALSE」の判定がされているので、if文で囲ってあげれば勝手に表示・非表示されるようになります。
なので、下記のように一度値を変数に代入したあと、if文で囲ってあげるだけ。
<?php $check = SCF::get('販売状況',11); ?>
<?php if($check): ?>
<p>販売機種は「<?php echo $model; ?>」です。</p>
<p>現在の値段は「¥<?php echo $price; ?>」です。</p>
<p>現在の在庫は「<?php echo $stock; ?>」台です。</p>
<?php else: ?>
<p>現在は売り切れ中です!</p>
<?php endif; ?>
上記のようにコードを記入したら、実際にチェックをオン・オフにしてあげましょう。
下記のようになればOK。
販売状況や応募状況に合わせて内容を表示・非表示にしてあげるだけ。
簡単すぎて泣けてくる。。
項目を空にする必要もないし、もう一度入力する手間も省けるのでので、クライアントも喜びまくりです\(^^)/
サイト運用するなら必須なので、ぜひ使ってみてください〜!
この記事がイイなと思ったらシェアお願いします\(^^)/
合わせて読みたい記事