0

更新：質問をもう少しよく説明したかもしれないので、ここで書き直しました。 検索結果をフロントエンドの[投稿タイプ]タブに分割するにはどうすればよいですか？

私はWordpressサイトを持っており、4つの投稿タイプがあります。検索を実行すると、4つの投稿タイプすべてが結果に表示されます。

私が望んでいるのは、ユーザーがこれらの結果を投稿タイプでフィルタリングできるようにすることです。

たとえば、4つの投稿タイプがあるとします

結果の上に、フィルタリングに役立つラジオボタンのセットを表示できますか？

  • すべての結果（デフォルト）
  • 投稿タイプ1でフィルタリング
  • 投稿タイプ2でフィルタリング
  • 投稿タイプ3でフィルタリング
  • 投稿タイプ4でフィルタリング

そうすれば、ユーザーは常にすべての投稿タイプのコンテンツを提供する代わりに、探している正確なコンテンツを簡単に見つけることができます。それだけです。

注：最良の方法はラジオボタンだと思いますが、フィールドもドロップダウンである可能性があります。

助けてくれてありがとう！

4

1 に答える 1

0

その場で結果をフィルタリングしたい場合は、AJAX ソリューション (潜在的に数千の結果を扱っている場合) を調べるか、Javascript/jQuery を使用して投稿タイプに基づいて結果の表示を切り替える必要があります。 . 簡単な解決策は、jQuery を使用したこのようなものです。

search.php テンプレートで:

<form action="" method="POST">
    <input class="radioToggle" type="radio" name="post_type" value="type1" />Filter 1<br/>
    <input class="radioToggle" type="radio" name="post_type" value="type2" />Filter 2<br/>
    <input class="radioToggle" type="radio" name="post_type" value="type3" />Filter 3<br/>
</form>
<div class="result type1">
    result of type 1....
</div>
<div class="result type2">
    result of type 2....
</div>
<div class="result type2">
    result of type 2....
</div>
<div class="result type3">
    result of type 3....
</div>
<div class="result type3">
    result of type 3....
</div>
<div class="result type3">
    result of type 3....
</div>
<script type="text/javascript">
    jQuery(document).ready(function($))
    {
        $(".radioToggle").click(function()
        {
            $(".result."+$(this).attr("value")).css("display", "block");
            $(".result:not(."+$(this).attr("value")+")").css("display", "none");
        });
    });
</script>

これはテストされておらず、個人的にはこれをオンザフライで行うことは避けたいと思います。個人的には、後で Javascript を使用するのではなく、事前に PHP を使用して検索結果をフィルタリングする必要があると考えています。それでも、これが UI に必要な場合は、これで作業を開始できます。

このメソッドを利用するには、jQuery をインストールするか、テーマによってエンキューする必要があることに注意してください。

于 2012-07-11T15:54:47.410 に答える