WordPressで複数の条件を組み合わせた検索フォーム

16Nov2017

WordPressで複数の条件を組み合わせた検索フォーム

ページコンテンツ

1 不動産サイトのような絞り込み検索

不動産サイトのような絞り込み検索

フォーム側

<form method="get" id="searchform" action="http://kotori-blog.com/test/">
<label for="s" class="assistive-text">検索</label>
<input type="text" class="field" name="s" id="s" placeholder="検索" />
 
<select name="catnum" style="margin-top:20px;">
    <option value="" selected>カテゴリ</option>
                                    <?php
$categories = get_categories('parent=0');
foreach($categories as $category) :
?>
    <option value="<?php echo $category->term_id; ?>"><?php echo $category->cat_name; ?></option>
<?php endforeach; ?>
</select>
 
<select name="placenum" style="margin-top:20px;">
    <option value="" selected>間取りタイプ(カスタムタクソノミー)</option>
<?php
$taxonomy_name = 'place';
$taxonomys = get_terms($taxonomy_name);
if(!is_wp_error($taxonomys) && count($taxonomys)):
    foreach($taxonomys as $taxonomy):
        $tax_posts = get_posts(array('post_type' => get_post_type(), 'taxonomy' => $taxonomy_name, 'term' => $taxonomy->slug ) );
        if($tax_posts):
?>
<option value="<?php echo $taxonomy->slug; ?>"><?php echo $taxonomy->name; ?></option>
<?php
        endif;
    endforeach;
endif;
?>
</select>
 
<select name="type" style="margin-top:20px;">
    <option value="" selected>ルームタイプ(カスタムフィールドのセレクトボックス)</option>
    <option value="アパート">アパート</option>
    <option value="マンション">マンション</option>
    <option value="一戸建て・その他">一戸建て・その他</option>
</select>
 
<div style="margin-top:20px">家賃(カスタムフィールドのテキストフィールド)</div>
<select name="low" style="margin-top:5x;">
    <option value="0" selected>下限なし</option>
    <option value="20000">20,000円以上</option>
    <option value="25000">25,000円以上</option>
    <option value="30000">30,000円以上</option>
    <option value="35000">35,000円以上</option>
    <option value="40000">40,000円以上</option>
    <option value="45000">45,000円以上</option>
    <option value="50000">50,000円以上</option>
    <option value="55000">55,000円以上</option>
    <option value="60000">60,000円以上</option>
    <option value="65000">65,000円以上</option>
    <option value="70000">70,000円以上</option>
    <option value="75000">75,000円以上</option>
    <option value="80000">80,000円以上</option>
</select>　～<br />
<select name="high" style="margin-top:5px;">
    <option value="20000">20,000円以下</option>
    <option value="25000">25,000円以下</option>
    <option value="30000">30,000円以下</option>
    <option value="35000">35,000円以下</option>
    <option value="40000">40,000円以下</option>
    <option value="45000">45,000円以下</option>
    <option value="50000">50,000円以下</option>
    <option value="55000">55,000円以下</option>
    <option value="60000">60,000円以下</option>
    <option value="65000">65,000円以下</option>
    <option value="70000">70,000円以下</option>
    <option value="75000">75,000円以下</option>
    <option value="80000">80,000円以下</option>
    <option value="9999999" selected>上限なし</option>
 
</select>
 
<div style="margin-top:20px">こだわり(タグ)</div>
<?php
$taxonomy_name = 'post_tag';
$taxonomys = get_terms($taxonomy_name);
if(!is_wp_error($taxonomys) && count($taxonomys)):
    foreach($taxonomys as $taxonomy):
        $tax_posts = get_posts(array('post_type' => get_post_type(), 'taxonomy' => $taxonomy_name, 'term' => $taxonomy->slug ) );
        if($tax_posts):
?>
<label><input type="checkbox" name="post_tag[]" value="<?php echo $taxonomy->slug; ?>"><?php echo $taxonomy->name; ?></label><br>
<?php
        endif;
    endforeach;
endif;
?>
 
<div>こだわり(カスタムフィールドのチェックボックス)</div>
<label><input type="checkbox" name="kodawari[]" value="駐車場あり">駐車場あり</label><br>
<label><input type="checkbox" name="kodawari[]" value="バス・トイレ別">バス・トイレ別</label><br>
<label><input type="checkbox" name="kodawari[]" value="ペット相談">ペット相談</label><br>
<label><input type="checkbox" name="kodawari[]" value="2階以上住戸">2階以上住戸</label>
 
<input type="submit" class="submit" name="submit" id="searchsubmit" value="検索" />
</form>

検索結果

<?php
$s = $_GET['s'];
$catnum = $_GET['catnum'];
$placenum = $_GET['placenum'];
$type = $_GET['type'];
$low = $_GET['low'];
$high = $_GET['high'];
$post_tag = $_GET['post_tag'];
$kodawari = $_GET['kodawari'];
 
if($catnum){
    $taxquerysp[] = array(
            'taxonomy'=>'category',
            'terms'=> $catnum,
            'include_children'=>false,
            'field'=>'term_id',
            'operator'=>'AND'
            );
}
 
if($post_tag){
    $taxquerysp[] = array(
            'taxonomy'=>'post_tag',
            'terms'=> $post_tag,
            'include_children'=>false,
            'field'=>'slug',
            'operator'=>'AND'
            );
}
 
if($placenum){
    $taxquerysp[] = array(
            'taxonomy'=>'place',
            'terms'=> $placenum,
            'include_children'=>false,
            'field'=>'slug',
            'operator'=>'AND'
            );
}
$taxquerysp['relation'] = 'AND';
 
if($kodawari){
    foreach($kodawari as $val){
        $metaquerysp[] = array(
                'key'=>'kodawari',
                'value'=> $val,
                );
    }
}
if($type){
    $metaquerysp[] = array(
            'key'=>'type',
            'value'=> $type,
            'compare'=>'=',
            );
}
$metaquerysp[] = array(
            'key'=>'price',
            'value'=>array( $low, $high ),
            'compare'=>'BETWEEN',
            'type'=>'NUMERIC',
            );
$metaquerysp['relation'] = 'AND';
 
?>
 
<?php if($s){ ?>検索キーワード：<?php echo $s; ?><br><?php } ?>
<?php if($catnum){ ?>カテゴリ：<?php echo get_cat_name($catnum); ?><br><?php } ?>
<?php if($placenum){ ?>間取りタイプ：<?php echo get_term_by('slug',$placenum,"place")->name; ?><br><?php } ?>
<?php if($type){ ?>ルームタイプ：<?php echo $type; ?><br><?php } ?>
<?php if($low == 0 && $high == 9999999){}else{ ?>家賃：<?php if($low == 0){ ?>下限なし<?php }else{ echo number_format($low).'円'; } ?> ～ <?php if($high == 9999999){ ?>上限なし<?php }else{ echo number_format($high).'円';} ?><br>
<br><?php } ?>
<?php
if (is_array($cutnum)) { ?>カテゴリ：<?php
foreach($cutnum as $val){
if ($val === end($cutnum)) {
echo get_cat_name($catnum);
    }else{
echo get_cat_name($catnum).", ";
}
}
}
 ?>
<?php
if (is_array($post_tag)) { ?>こだわり(タグ)：<?php
foreach($post_tag as $val){
if ($val === end($post_tag)) {
echo get_term_by('slug',$val,"post_tag")->name;
    }else{
echo get_term_by('slug',$val,"post_tag")->name.", ";
}
}
 ?><br><br><?php } ?>
<?php if (is_array($kodawari)) { ?>こだわり(カスタムフィールドのチェックボックス)：<?php
if (is_array($kodawari)) {
foreach($kodawari  as $val){
if ($val === end($kodawari)) {
echo $val;
    }else{
echo $val.", ";
}
}
}
}
 ?>
 
<?php
 
query_posts( array(
    'tax_query' => $taxquerysp,
    'meta_query' => $metaquerysp,
    's' => $s,
    )
);
 
?>
 
            <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div><?php the_title(); ?></div>
<div><?php the_content(); ?></div>
            <?php endwhile; else : ?>
 
該当なし
 
            <?php endif;wp_reset_query(); ?>

ページネーション

<?php
$s = $_GET['s'];
$catnum = $_GET['catnum'];
$placenum = $_GET['placenum'];
$type = $_GET['type'];
$low = $_GET['low'];
$high = $_GET['high'];
$post_tag = $_GET['post_tag'];
$kodawari = $_GET['kodawari'];
 
if($catnum){
    $taxquerysp[] = array(
            'taxonomy'=>'category',
            'terms'=> $catnum,
            'include_children'=>false,
            'field'=>'term_id',
            'operator'=>'AND'
            );
}
 
if($post_tag){
    $taxquerysp[] = array(
            'taxonomy'=>'post_tag',
            'terms'=> $post_tag,
            'include_children'=>false,
            'field'=>'slug',
            'operator'=>'AND'
            );
}
 
if($placenum){
    $taxquerysp[] = array(
            'taxonomy'=>'place',
            'terms'=> $placenum,
            'include_children'=>false,
            'field'=>'slug',
            'operator'=>'AND'
            );
}
$taxquerysp['relation'] = 'AND';
 
if($kodawari){
    foreach($kodawari as $val){
        $metaquerysp[] = array(
                'key'=>'kodawari',
                'value'=> $val,
                );
    }
}
if($type){
    $metaquerysp[] = array(
            'key'=>'type',
            'value'=> $type,
            'compare'=>'=',
            );
}
$metaquerysp[] = array(
            'key'=>'price',
            'value'=>array( $low, $high ),
            'compare'=>'BETWEEN',
            'type'=>'NUMERIC',
            );
$metaquerysp['relation'] = 'AND';
 
?>
 
<?php if($s){ ?>検索キーワード：<?php echo $s; ?><br><?php } ?>
<?php if($catnum){ ?>カテゴリ：<?php echo get_cat_name($catnum); ?><br><?php } ?>
<?php if($placenum){ ?>間取りタイプ：<?php echo get_term_by('slug',$placenum,"place")->name; ?><br><?php } ?>
<?php if($type){ ?>ルームタイプ：<?php echo $type; ?><br><?php } ?>
<?php if($low == 0 && $high == 9999999){}else{ ?>家賃：<?php if($low == 0){ ?>下限なし<?php }else{ echo number_format($low).'円'; } ?> ～ <?php if($high == 9999999){ ?>上限なし<?php }else{ echo number_format($high).'円';} ?><br>
<br><?php } ?>
<?php
if (is_array($cutnum)) { ?>カテゴリ：<?php
foreach($cutnum as $val){
if ($val === end($cutnum)) {
echo get_cat_name($catnum);
    }else{
echo get_cat_name($catnum).", ";
}
}
}
 ?>
<?php
if (is_array($post_tag)) { ?>こだわり(タグ)：<?php
foreach($post_tag as $val){
if ($val === end($post_tag)) {
echo get_term_by('slug',$val,"post_tag")->name;
    }else{
echo get_term_by('slug',$val,"post_tag")->name.", ";
}
}
 ?><br><br><?php } ?>
<?php if (is_array($kodawari)) { ?>こだわり(カスタムフィールドのチェックボックス)：<?php
if (is_array($kodawari)) {
foreach($kodawari  as $val){
if ($val === end($kodawari)) {
echo $val;
    }else{
echo $val.", ";
}
}
}
}
 ?>
 
<?php
 
query_posts( array(
    'tax_query' => $taxquerysp,
    'meta_query' => $metaquerysp,
    's' => $s,
    'posts_per_page' => 1,
    'paged' => $paged,
    )
);
 
?>
 
            <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div><?php the_title(); ?></div>
<div><?php the_content(); ?></div>
            <?php endwhile; else : ?>
 
該当なし
 
            <?php endif; ?>
 
<?php
wp_pagenavi(); //ページ送り
wp_reset_query();
 ?>

引用元：

http://kotori-blog.com/wordpress/refinement_search/

便利でよく使うCSS関数

POST/GETを使った際にリロードによる2重送信を防止する

ピックアップ記事

2019/10/23
Gutenberg ブロックエディタに設定した内容をカスタムフィールドを含め他のページで表示する

他のページで設定したブロックの内容を表示したかった時の覚書。汎用性からショートコードにまとめ…
2018/12/9
Really Simple CSV Importerプラグインでパーマリンクの末尾に付く「-2」をSQLで一括削除

大量の記事をCSVで一気に流し込めるプラグイン「Really Simple CSV Importer…
2018/7/24
【令和追加】date()関数を日本の元号に対応させる

未だに明治やら大正やら昭和やら平成やら日本の元号がちょくちょく利用されますが、素晴らしいdate()…

WordPressで複数の条件を組み合わせた検索フォーム

不動産サイトのような絞り込み検索

フォーム側

検索結果

ページネーション

関連記事

WordPressの記事IDから投稿者IDを取得する

Woocommerceでバリエーションをもつ商品の価格表示を1つ…

管理画面のカスタム投稿記事一覧ページでカスタムタクソノミーで絞り…

画像のキャプションを制御

WordPressのヘッダーから余分なMETA情報や絵文字関連を…

Advanced Custom Fields PROの「オプショ…

おすすめ記事

コメント

カテゴリー

ピックアップ記事

最新記事

アーカイブ