Wordpressで地域店舗のポ-タルサイトを作ろうとしており、以下について教えてください。

Wordpressの投稿(post)が各店舗の情報となっています。
カスタムフィ-ルドで住所デ-タ(address)を追加しており、各店舗(post)にはそれぞれ住所が入っています。
そして各店舗はそれぞれ、「ペット関係」「家関係」「飲食」というカテゴリ-のいずれかに属しています。
現在、トップペ-ジには入力フォ-ムがあり、そのフォ-ムに住所の一部を入れ「検索」ボタンを押すとマップが表示され、そのマップ上に先ほど入力したワ-ドを住所デ-タ(address)に含んだ店舗のみが表示されるようになっております。
例えばこのフォ-ムに「世田谷区」と入力すると世田谷区にある店舗が、「千代田区」と入力すると千代田区の店舗が表示されるようになっています。

フォ-ムの上にそれぞれのカテゴリ-のチェックボックスを作り、そこにチェックをつけて、更に住所を入れ、「検索」ボタンを押すと、チェックのついたカテゴリ-の、入力された住所にある店舗のみをマップに表示させたいのです。
これをどうすれば上記が満足できるでしょうか。

回答の条件
  • 1人1回まで
  • 13歳以上
  • 登録:2016/05/12 00:24:40
  • 終了:2016/05/12 01:18:32
id:ykhpno1

カテゴリ-のチェックボックスにチェックが複数入っている時はORで、更にそれらと住所はANDで絞り込まれる、というイメ-ジです。
例えば「家関係」と「飲食」にチェックが入っていれば、それらのカテゴリ-に属する店舗を住所で絞り込みたいのです。

現状のコ-ドは以下となります。


<?php
    if (have_posts()) {
        while (have_posts()) {
            the_post();
            get_template_part('content', 'page');
        }
    }
?>



<form action="" method="post">
    検索したい地域 <input type="text" name="place">
    <input type="submit" name="send" value="検索">
</form>




<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

<?php
$place = $_POST['place'];
if ($place):

    $args = Array(
        'post_type' => 'post',
        'posts_per_page' => -1,
        'meta_query' => array(array(
            'key' => 'address',
            'value' => $place,
            'compare' => 'LIKE'
        ))
    );

    $the_query = new WP_Query($args);
    if ($the_query->have_posts()):
?>
<div id="map" style="width: 99%; height: 650px;"></div>
<script type="text/javascript">
    google.maps.event.addDomListener(window, 'load', function() {
        var mapdiv = document.getElementById( 'map' );
        var myOptions = {
            zoom: 11,
            center: new google.maps.LatLng( <?php echo post_custom("centerlat")?>,<?php echo post_custom("centerlng")?> ),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            scaleControl: true
        };
        var map = new google.maps.Map( mapdiv, myOptions );
        var marker = [];
        var infowindow = [];

<?php $m=0; $m1=0; $m2=0; $i=0; $i2=0; ?>



<?php
    while($the_query -> have_posts()): $the_query -> the_post();
?>



marker[<?php echo $m++; ?>] = new google.maps.Marker({
    icon: 'http://maps.google.co.jp/mapfiles/ms/icons/red-dot.png',
    position: new google.maps.LatLng( <?php echo post_custom("lat")?>,<?php echo post_custom("lon")?> ),
    map: map,
    title: '<?php the_title(); ?>'
});

infowindow[<?php echo $i++; ?>] = new google.maps.InfoWindow({
    content: '<div style="width : 100%;height : 36PX;">'+'<?php echo post_custom("Name")?>:<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>',
    size: new google.maps.Size( 50, 30 )
});

google.maps.event.addListener( marker[<?php echo $m1++; ?>], 'click', function() {
    var iw = infowindow[<?php echo $i2++; ?>];
    if (iw.getMap() == null){
        iw.open(map, marker[<?php echo $m2++; ?>]);
    }
    else{
    iw.close();
    }
});

<?php endwhile; // End the loop. Whew. ?>

});
</script>
    <?php else: ?>
    該当する店舗はありませんでした。
    <?php endif; ?>

<?php else: ?>
地域を入力してください。
<?php endif; ?>

ベストアンサー

id:a-kuma3 No.1

a-kuma3回答回数4324ベストアンサー獲得回数17732016/05/12 00:42:10

ポイント500pt

カテゴリーを検索条件に入れるためのパラメータがいくつかあるのですが、質問のケースでは category__in を使うのが良いと思います。
 → 関数リファレンス/WP Query - WordPress Codex 日本語版

検索用のフォームには、PHP の配列形式で受け取れるような name を指定した <input type="checkbox"> を追加します。

プログラムの骨子はこんな感じです。

<form action="" method="post">
    検索したい地域 <input type="text" name="place" value="<?php echo $place ?>">
<!-- カテゴリーの指定 -->
<label><input type="checkbox" name="cc[]" value="2">飲食             </label>
<label><input type="checkbox" name="cc[]" value="3">家関係           </label>
<label><input type="checkbox" name="cc[]" value="4">ファッション関係 </label>
<label><input type="checkbox" name="cc[]" value="5">ペット関係       </label>
    <br>
    <input type="submit" name="send" value="検索">
</form>

    ...

<?php

    $args = Array(
        'post_type' => 'post',
        'posts_per_page' => -1,
        'meta_query' => array(array(
            'key' => 'address',
            'value' => $place,
            'compare' => 'LIKE'
        ))
    );

    // カテゴリーのどれかにチェックが入っていたら、検索条件を追加する
    $cc = $_POST['cc'];
    if (sizeof($cc) > 0) {
        $args['category__in'] = $cc;
    }

    $the_query = new WP_Query($args);
    if ($the_query->have_posts()):
        ...

チェックボックスの value に設定しているのは、カテゴリーの ID です。

チェックを入れたものしかリクエストパラメータに乗らないので、ひとつもチェックが入っていない場合には、$_POST['cc'] で取得した配列は空の配列になります。

カテゴリーのチェックが入っているかどうかを判定して、WP_Query のパラメータに検索条件を追加して、後は元の通り検索をします。

他3件のコメントを見る
id:ykhpno1

気にかけていただいてありがとうございます。
その件に関しては、カテゴリ-スラッグと同じ名前のアイコンを作っておき、グ-グルマップのアイコン表示部分のコ-ドを以下としています。

 icon: '<?php bloginfo('template_url');?>/images/<?php echo $catslug; ?>.png'

例えば、おすすめというカテゴリ-のカテゴリ-スラッグがosusumeであれば、osusume.pngというアイコンを、建築というカテゴリ-のカテゴリ-スラッグがkenchikuであるなら、kenchiku.pngというアイコンをアップしておくことでカテゴリ-ごとにマ-カ-を変えております。
ぜんぜんスマ-トではないのですが(笑)。

コメントいただきありがとうございます。

2016/05/14 21:06:33
id:a-kuma3

スラッグか ID でアイコンの URL を決めることになると思うので、それで良いと思います :-)

2016/05/14 21:37:05

その他の回答(0件)

id:a-kuma3 No.1

a-kuma3回答回数4324ベストアンサー獲得回数17732016/05/12 00:42:10ここでベストアンサー

ポイント500pt

カテゴリーを検索条件に入れるためのパラメータがいくつかあるのですが、質問のケースでは category__in を使うのが良いと思います。
 → 関数リファレンス/WP Query - WordPress Codex 日本語版

検索用のフォームには、PHP の配列形式で受け取れるような name を指定した <input type="checkbox"> を追加します。

プログラムの骨子はこんな感じです。

<form action="" method="post">
    検索したい地域 <input type="text" name="place" value="<?php echo $place ?>">
<!-- カテゴリーの指定 -->
<label><input type="checkbox" name="cc[]" value="2">飲食             </label>
<label><input type="checkbox" name="cc[]" value="3">家関係           </label>
<label><input type="checkbox" name="cc[]" value="4">ファッション関係 </label>
<label><input type="checkbox" name="cc[]" value="5">ペット関係       </label>
    <br>
    <input type="submit" name="send" value="検索">
</form>

    ...

<?php

    $args = Array(
        'post_type' => 'post',
        'posts_per_page' => -1,
        'meta_query' => array(array(
            'key' => 'address',
            'value' => $place,
            'compare' => 'LIKE'
        ))
    );

    // カテゴリーのどれかにチェックが入っていたら、検索条件を追加する
    $cc = $_POST['cc'];
    if (sizeof($cc) > 0) {
        $args['category__in'] = $cc;
    }

    $the_query = new WP_Query($args);
    if ($the_query->have_posts()):
        ...

チェックボックスの value に設定しているのは、カテゴリーの ID です。

チェックを入れたものしかリクエストパラメータに乗らないので、ひとつもチェックが入っていない場合には、$_POST['cc'] で取得した配列は空の配列になります。

カテゴリーのチェックが入っているかどうかを判定して、WP_Query のパラメータに検索条件を追加して、後は元の通り検索をします。

他3件のコメントを見る
id:ykhpno1

気にかけていただいてありがとうございます。
その件に関しては、カテゴリ-スラッグと同じ名前のアイコンを作っておき、グ-グルマップのアイコン表示部分のコ-ドを以下としています。

 icon: '<?php bloginfo('template_url');?>/images/<?php echo $catslug; ?>.png'

例えば、おすすめというカテゴリ-のカテゴリ-スラッグがosusumeであれば、osusume.pngというアイコンを、建築というカテゴリ-のカテゴリ-スラッグがkenchikuであるなら、kenchiku.pngというアイコンをアップしておくことでカテゴリ-ごとにマ-カ-を変えております。
ぜんぜんスマ-トではないのですが(笑)。

コメントいただきありがとうございます。

2016/05/14 21:06:33
id:a-kuma3

スラッグか ID でアイコンの URL を決めることになると思うので、それで良いと思います :-)

2016/05/14 21:37:05

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません