カスタムフィールド（ACF）の絞り込み検索

Question

実現したいこと

参考サイト：https://sukigyu.net/filter-search/

Wordpressにてカスタムフィールド（ACF）を使用し、衣類の色分けをしているのですが、その色を検索条件に加えたいです。
検索ワードに色（ホワイトなど）を入力し検索すると絞り込むことはできており、カテゴリーの「check01」も問題なく絞り込みができています。
ただ、カスタムフィールドの「check02」の色を選択し、検索をしても「該当なし」となってしまいます。
色々と試していますが、解決に至らずでご質問させていただきました。
ちなみに色は選択肢を数十個追加していく予定です。
どなたかご教授いただけますと幸いです。
宜しくお願い致します。

該当のソースコード

■フォームのコード

<div>
<label>フリーワード検索：
<input type="search"
	placeholder="<?php echo esc_attr_x( 'キーワードを入力', 'placeholder'); ?>"
	value="<?php echo esc_html( get_search_query() ); ?>" name="s" >
</label>
</div>
	<div>カテゴリーorタグorカスタムタクソノミー</div>
		<div>チェックボックス:
<?php 
$terms = get_terms( 'category', array(
	'orderby' => 'name'  //色々指定できます
	) );
    if(!is_wp_error($terms)):
        foreach($terms as $term):

//チェックリスト値の受け渡し
$t_check=filter_input(INPUT_GET,'check01',FILTER_DEFAULT,["options" => ["default" => []],"flags" => FILTER_REQUIRE_ARRAY]);
$checked["check01"] = [ $term->term_id => ""];
foreach((array)$t_check as $val){
  $checked["check01"][$val]="checked";
}
?>
<label><input type="checkbox" name="check01[]" value="<?php echo $term->term_id; ?>" <?php echo $checked["check01"][$term->term_id]; ?>><?php echo $term->name . '(' . $term->count . ')'; ?></label>
<?php endforeach; endif; ?>
	</div>

	<div>カスタムフィールド</div>
		<div>チェックボックス：
	<?php
//チェックリスト値の受け渡し
$r_check=filter_input(INPUT_GET,'check02',FILTER_DEFAULT,["options" => ["default" => []],"flags" => FILTER_REQUIRE_ARRAY]);
$checked["check02"] = [ "ホワイト" => "", "オフホワイト" => "" ];
foreach((array)$r_check as $val){
  $checked["check02"][$val]="checked";
}
?>
    <label><input type="checkbox" name="check02[]" value="ホワイト" <?php echo $checked["check02"]["ホワイト"]; ?>>ホワイト</label>
    <label><input type="checkbox" name="check02[]" value="オフホワイト" <?php echo $checked["check02"]["オフホワイト"]; ?>>オフホワイト</label>
</div>

<input type="submit" value="絞り込む" />
	<a href="/?s=">条件クリア</a>
</form>

■search.php（検索結果ページ）のコード

        $s = $_GET['s'];

if(isset($_GET['check01'])){
	$taxquerysp[] = array(
        'taxonomy'=> 'category',
        'terms'=> $_GET['check01'],
		'operator'=>'AND',
		'include_children'=>false
    );
	}else{
	 $taxquerysp[] = '';
 }

if (isset($_GET['check02'])){
        $metaquerysp[] = array(
			'key'=>'color',
			'value'=> $_GET['check02']
                );
}else{
	 $metaquerysp[] = '';
 }

$paged = get_query_var('paged') ? get_query_var('paged') : 1; //pagination settings
$search_args = array(
	's' => $s,
	'tax_query' => $taxquerysp,
	'meta_query' => $metaquerysp,
	'posts_per_page' =>10,  //ページネーション設定 
	'paged' => $paged, //ページネーション設定
);
$the_query = new WP_Query( $search_args ); ?>

		<!--<?php get_search_form(); //検索フォームの表示 ?>-->

<div class="allitem-list-inner">
	
<div>検索結果：全 <?php echo $the_query->found_posts.' 件'; ?></div>

<div class="item-list-inner">

<?php /* Start the Loop */ ?>
	<?php if ( $the_query->found_posts ) {
		while ( $the_query->have_posts() ) : $the_query->the_post(); ?>

ここに検索結果が表示される
		
	<?php endwhile; ?>
	
</div>
	
<?php //ページネーション設置
  $GLOBALS['wp_query']->max_num_pages = $the_query->max_num_pages;
  $args = array(
      'mid-size' => 2,
      'prev_text' => '≪前へ',
      'next_text' => '次へ≫',
      'screen_reader_text' => 'ページナビゲーション'
  );
  the_posts_pagination($args); ?>

		<?php wp_reset_postdata(); ?>

	<?php }else{ ?>

		<p>検索結果なし</p>

	<?php } ?>

Comments

[gogoweb_ikeda]

check02の内容は単一の値ですか？
チェックボックスなど複数の値がはいる形式の場合はACFはserializeされた配列で登録されるので完全一致ではヒットしません

[yasu518]

check02の内容は複数選択が可能にしたいです。
ホワイト・オフホワイトが両方選択された場合、両方に該当する商品を表示させたいです。
記載の参考サイトを執筆されている方の「絞り込み検索のサンプル」にログインして確認したのですが、複数選択をしても表示されるのようなのですが、こちらはどのように実装すれば良いのでしょうか？

[yasu518]

失礼しました。
「絞り込み検索のサンプル」はこちらのサイトより確認いたしました。
https://kotori-blog.com/wordpress/refinement_search/

Answer 1

絞り込み検索にACFの値は利用せず、カテゴリーに全て再登録することで実装し解決しました。

Answer 2

ACFのチェックボックスはデータが単一のフィールドにシリアライズされて登録されるので検索に向いていません。
仕様を変更していいならフィールドタイプをタクソノミーにしてタクソノミーと連動させてそちらで検索を絞るといいと思います。

Comments

[yasu518]

ご回答有難う御座います。
現状で100以上の商品を登録し、完成してしまっている状態ですので、仕様は変更せずに実現させるのはやはり難しいでしょうか？
もしくは、キーワード検索では絞り込めるので、単純に選択したチェックボックスを検索に追加するという方法はないでしょうか？
無知でご迷惑をおかけいたします。

[gogoweb_ikeda]

一応check02のMetaqueryに"compare" => "LIKE"を追加することでシリアライズされたデータの中にキーワードが含まれている場合一致と判定させられますが、想定外の結果になりやすいのであまりお勧めしません。
例えば赤紫色で登録している製品に紫色で検索をかけた場合でも一致してしまいます。

[yasu518]

ありがとうございます。
別の方法を考えたのですが、例えば今回は検索ではなく、絞り込んだ色ごとにページとリンクを作成し表示する方法は実現可能でしょうか？
フィールドにチェックして登録されている各色味（ホワイト・オフホワイト・ブラックなど）をホワイト系を表示させるページ（ホワイト・オフホワイトが表示）ブラック系を表示させるページ（ブラック・ダークブラウン）などは可能でしょうか？

検索窓の下に以下リンクを作成
ホワイト系→ホワイト・オフホワイトの商品の一覧ページへ
ブラック系→ブラック・ダークブラウンの商品の一覧ページへ

のようなイメージです。