Advanced Custom Fields で、チェックの無い項目も表示させたい

Question

前提・実現したいこと

プラグインAdvanced Custom Fieldsを使って

<ul class="kudamono">
 <li><span class="maru"><i class="far fa-circle"></i>りんご</span></li>
 <li><span class="batsu"><i class="fas fa-times"></i>みかん</span></li>
 <li><span class="batsu"><i class="fas fa-times"></i>なし</span></li>
 <li><span class="maru"><i class="far fa-circle"></i>小麦粉</span></li>
 <li><span class="sankaku"><i class="far fa-triangle">大豆</span></li>
 .
 .
 .
</ul>

のように出力したいと思います。

試してみたこと

<ul class="kudamono">
 <?php
 $field = get_field( 'option' );
 if ( $field ):
  foreach ( $field as $value ) {
   echo '<li>';
   echo '<span class="">' . $value . '</span>';
   echo '</li>';
  }
 ?>
</ul>

までは試行錯誤し

<ul class="kudamono">
 <li><span class="">りんご</span></li>
 <li><span class="">みかん</span></li>
 <li><span class="">なし</span></li>
 <li><span class="">小麦粉</span></li>
 <li><span class="">大豆</span></li>
 .
 .
 .
</ul>

と、出力できたのですが、

①
チェックボックスにチェックを入れていない項目も出力したい
②
maruの時にはウェブフォント<i class="far fa-circle"></i>
batsuの時にはウェブフォント<i class="fas fa-times"></i>
sankakuの時にはウェブフォント<i class="far fa-triangle"></i>
を文頭に入れたい
③
spantagにそれぞれのクラス名を付与し、

maruの項目は青色背景のボタン化
batsuの項目は赤色背景のボタン化
sankakuの項目は着色背景のボタン化

のように装飾したいのですが、どうしたらよいのかさっぱりわかりません。

ACFの設定画面は
フィールドタイプはチェックボックス
選択肢には改行で「りんご　みかん　なし　小麦粉　大豆」といれてあります。

ヒントや参考URLなど教えていただけないでしょうか。

Answer 1

get_field_objectで項目のラベルが取得できますので、それを元に出力すればよいです。

【Advanced Custom Fieldsによるカスタムフィールドの出力 [チェックボックス・ラジオボタン編] | KERENOR { ケレンオール }】
https://www.kerenor.jp/advanced-custom-fields-checkbox/

Comments

[takako]

ご回答ありがとうございます。
さっそくget_field_objectを調べてわからないながらも
<?php
$field = get_field_object( 'option' );
if ( $field && $field['choices'] ) {
echo '<ul>';
foreach ( $field['choices'] as $key => $value ) {
$class = ( is_array( $field['value'] ) && in_array( $key, $field['value'] ) ) ? ' class="maru"' : '';
echo "<li{$class}>{$value}</li>";
}
}
echo '</ul>';
?>

で、チェックがはいった項目にclass名をつけることはできました。
一歩前進した気がしました。

本当に感謝です。

よくよく考えてみたら、３種のクラス分けはできませんよね。
チェックボックスはオンかオフのどちらかですし...。

考え方を変えて、

オンの場合はclass="maru"
オフの場合はclass="batsu"

としたいと思いますが、if文？else？
どう書いていけばいいのか教えていただけませんか？

[kei344]

> チェックがはいった項目にclass名をつけることはできました。
チェックの入っていないほうにもクラス名を入れたいのですよね、なら三項演算子で「''」を代入しているところにバツの場合のクラスを入れればよいのでは。

[takako]

ありがとうございます！
ヒントを頂けたおかげで無事に表示することができました。

大変助かりましたm(__)m

```
ソースコード

<?php
$cbobj = get_field_object( 'fruits' );
$fruits = get_field( 'fruits' );
if ( empty( $fruits ) )
$fruits = array();
?>
<ul>
<?php
foreach ( $cbobj['choices'] as $key => $value ):
$checked = in_array( $key, $fruits ) ? 'class="ok"' : 'class="ng"'; ?>
<li <?php echo $checked; ?>>
<?php echo $value; ?>
</li>
<?php endforeach; ?>
</ul>
```

```
出力結果

<ul>
<li class="ok">りんご</li>
<li class="ng">ばなな</li>
<li class="ng">なし</li>
<li class="ng">ぶどう</li>
</ul>
```