[WordPress] カテゴリー・タームの一覧をラジオボタン形式で表示したい

公開日:2022/04/13 更新日:2022/04/19

記事の一覧をターム情報で絞り込むといった動作をさせたいとき、タームの一覧をラジオボタンで表示したい場合があります。

そんなときにさっと使えるサンプルコードを検討してみました。

セレクトボックス版はこちら。チェックボックス版はこちら。

サンプルコード

<form action="" method="get">
    <?php
        $terms = get_terms('tax_xxx');
        if(!empty($terms) && !is_wp_error($terms)) {
            foreach($terms as $term) {
                echo '<label><input type="radio" name="radio_xxx" value="'. $term->slug .'"><span>'. $term->name .'</span></label>';
            }
        }
    ?>
</form>

「get_terms」関数を使用することで、引数に指定したタクソノミーのターム情報を配列で取得できます。

取得した配列情報をforeach関数で一つずつ取り出してループさせます。サンプルコードでは「$term->slug」でラジオボタンのvalueにタームのスラッグを設定しています。

取得したラジオボタンの値をクエリに反映させる

上記サンプルコードでフォーム送信したあと、ラジオボタンのvalueに設定されたタームのスラッグを使って記事の絞り込みを行う場合のサンプルコードも紹介します。

<?php
    $args = array(
        'post_type' => 'post_type_xxx',
    );
    if($_GET['radio_xxx']) {
        $args += array(
            'tax_query' => array(
                array(
                    'taxonomy' => 'tax_xxx',
                    'field' => 'slug',
                    'terms' => '$_GET['radio_xxx']'
                )
            )
        );
    }
    $the_query = new WP_Query($args);
    if($the_query->have_posts()) {
        while($the_query->have_posts()) {
            $the_query->the_post();
            
?>
            〜
<?php
        }
    }
    wp_reset_postdata();
?>

「$_GET['radio_xxx'])」の内容が空ではない（＝ラジオボタンのデータがGET方式で渡されている）ときにだけ、「tax_query」の「terms」にラジオボタンの値（スラッグ）を設定します。

設定されたパラメーターで「WP_Query」を実行することで、選ばれたラジオボタンに該当する記事のみが出力されます。

ご質問など受け付けています

記事の中でわかりにくかったところ、もっと知りたかったこと、間違っていることなど、何でもお気軽にご連絡ください。

ご連絡は下記フォームを利用いただくか、ツイッターアカウント@flat8migi宛てでもOKです。