FAB CREATE

ウェブデザイナーの日記や仕事での備忘録です

2021/03/30

web関連

Smart Custom Fieldsのチェックボックスの出力をカスタムする

先日WordPressでポートフォリオのページを作っていた際、
Smart Custom Fieldsのチェックボックスの値の書き出しでつまづきかけました。

私がやりたかった事をやってる記事が見つからなかったのでまとめてみました。

通常のSmart Custom Fieldsのチェックボックスの値の出力

<?php
$hoge = SCF::get('hoge');
foreach ($hoge as $field) {
echo $field;
}
?>

こんな感じでしょうか。

これだと持ってる値を全て出力してくれます。

でもこのままだと使いにくい。。。

私のポートフォリオページには、「web」「Graphic」「illustration」の三つのカテゴリーがあります。

事例の中には「web」と「Graphic」二つに跨がるものもあります。

そんな時上のコードをそのまま出力すると

webgraphic

って表示されちゃいますよね。

これだと使いにくいので、下記の出力方法を試してみました。

Pダグで囲ってみる

<?php
$hoge = SCF::get('hoge');
foreach ($hoge as $field) { ?>
<p><?php echo $field; ?></p>
<?php }
?>

こんな感じでしょうか。

そんな時上のコードを出力すると

<p>web</p>
<p>graphic</p>

と表示できました。

カンマ等で区切りたい

上記は上記で良いんですが、

web,graphic

みたいに表示がしたい。

この辺でつまづきかけました。

その場合はimplodeを使うみたいです。

<?php
$hoge = SCF::get('hoge');
	echo implode(',', $hoge); 
?>

これで値と値の間にカンマを入れる事ができました。

そこから更にカスタムしたかった

この出力の値をjQueryのライブラリのトリガーにしたかったのですが、
このままだと望んだ形になってくれませんでした。

私がやりたかった形は、

"web","graphic"

みたいにダブルコーテーションで挟まれた形にしたかったんです。

これはimplodeでも無理なのかなー?と調べながら半ば諦めかけてたところ、
割と無理やり対応できました。笑

"<?php
$hoge = SCF::get('hoge');
	echo implode('","', $hoge); 
?>"

phpの前後にダブルコーテーションを入れて、impoladeでの出力を”,”で行うようにしました。

すると下記の様に出力する事ができました。

//値が1つの場合
"web"

//値が2つの場合
"web","graphic"

//値が3つの場合
"web","graphic","illustration"

思ったより力技ですが希望通りの出力になったので満足です!笑

値が0個の場合、ダブルコーテーションだけが表示される事になりますが、
その場合どうするんでしょうね?笑

データがあるかないかの判定してif文で分岐させるとかですかね。

今回は必ずチェックが1つ以上入る場合に限りますが、なんとか実装できました。

まとめ

一つしか値がない場合は、そのままecho $field;で出力。

整えて出力したい場合は、echo implode(‘間に入れたい文字’, $hoge);で出力。

正直phpは少し触れる程度であんまり詳しくないもので、
書き方とか間違ってたら教えてもらえると嬉しいです。

phpもうちょっとちゃんとできる様に勉強しないと💦

コメントを残す

メールアドレスは公開されません。

内容に問題なければ、「コメントを送信する」ボタンを押してください。

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.