WordPressの投稿とページフィルタリングの究極のガイド

公開: 2017-07-13

Amazonで買い物をしたことがある場合は、大量のコンテンツにドリルダウンして目的のコンテンツを正確に特定するフィルターの機能をすでに理解している可能性があります。 Amazonで商品を検索するときは、検索を絞り込むのに役立つフィルターでいっぱいのサイドバーが常にあり、最も重要な要件を満たす結果だけが返されます。顧客の評価、ブランド、製品が男性用か女性用か、状態（新品/中古）などのフィルター。

コンテンツフィルターがどれほど便利であるかを考えると、WordPressコンテンツ用にフィルターを作成する機能がWordPressCoreに組み込まれているのは当然のことです。そして、少しのノウハウで、あなたはあなたのサイト訪問者にその力をもたらすことができます-彼らがあなたのコンテンツをこれまで以上に機敏にナビゲートすることを可能にします。

この投稿では、プラグインを使用してユーザー向けのコンテンツフィルタリングオプションを作成するプロセスについて説明します。

始めましょう！

なぜWordPressの投稿とページのフィルタリング？

WordPressは信じられないほど柔軟性があります。コアを使用すると、サイト上のすべてを完全に制御できます。投稿とページのフィルタリングは、WordPressの最も強力な機能の1つです。投稿、ページ、カスタムコンテンツ用の組み込み関数がいくつかあります。さらに、データベースに保存されているアイテムを選択、グループ化、およびフィルタリングする方法は多数あります。ページテンプレート、投稿タイプ、分類用語、テンプレート階層、製品ページ、またはその他の必要なものごとに、検索結果の並べ替え可能なリストを作成できます。

デフォルトでは、WordPressには検索機能が組み込まれています。ただし、その検索機能には多くの要望があり、読者が特定の方法で結果をフィルタリングしたい場合には役立ちません。そこで、サードパーティのプラグインの助けが役立ちます。

Search＆Filterプラグインは何をしますか？

Search＆Filterプラグインは、デフォルトのWordPress検索ボックスを次のレベルに引き上げる使いやすいプラグインです。これにより、訪問者は特定の用語を検索し、カテゴリ、タグ、カスタム投稿タイプ、カスタム分類法、日付範囲、またはそれらすべての組み合わせに基づいて結果をフィルタリングし、より洗練された検索とより正確な結果を得ることができます。

プラグインの使用は非常に簡単です。プラグインをインストールしてアクティブ化すると、プラグインの使用方法の詳細な説明が記載された設定ページが表示されます。一言で言えば、投稿、ページ、またはウィジェット化されたサイドバーのどこでもショートコードを使用できます。または、勇気があり、小さなコードで手を汚してもかまわない場合は、テーマファイルに1行のコードを貼り付けることができます。

いくつかの例を見てみましょう。

検索とフィルターを使用して投稿をフィルターする方法

プラグインの最も基本的な使用法は、訪問者がすべてのカテゴリとタグを検索できるようにするショートコードです。デフォルトのショートコードは次のようになります。

[searchandfilter fields="search,category,post_tag"]

これを任意の投稿、ページ、またはテキストウィジェットに挿入すると、フロントエンドに検索、カテゴリ、およびタグのフィールドを含むフィルタリングオプションが表示されます。

訪問者が複数のカテゴリまたはタグを選択できるようにする場合は、ショートコードを変更してドロップダウンの代わりにチェックボックスを含め、各フィールドにラベルを付けることで簡単に選択できます。

[searchandfilter headings="Select categories:" types="checkbox" fields="category"]

上記の例は、サイドバーでプラグインを使用する方法を示しています。ただし、テーマファイル内で使用して、任意のページに表示することもできます。以下の例では、フォームがブログページに表示されます。次のコード行を貼り付けるだけです。

<?php echo do_shortcode('[searchandfilter fields="search,category,post_tag"]'); ?>

私たちの場合、それをTwentySeventeenテーマのメインインデックステンプレートに追加しました。

カスタム分類法をフィルタリングする方法は？

上記の例は、プラグインの非常に基本的な使用法を示しています。ただし、Search＆Filterプラグインは他のパラメーターも受け入れます。訪問者がカスタム分類法に対してのみ検索結果をフィルタリングできるようにするショートコードを使用できます。

あなたのサイトにWooCommerceのショップがあるとしましょう。検索結果に製品カテゴリを含める場合は、次のショートコードを追加するだけです。

[searchandfilter taxonomies="search,category,post_tag,product_cat" headings=",Categories,Tags,Product Categories"]

この例では、各フィールドの前に見出しを追加して、訪問者がフィールドを簡単に区別できるようにしました。

これをテーマのページに表示したい場合は、次のコード行を適切なページテンプレートの[外観]> [テーマ]> [エディター]に貼り付けるだけです。

<?php echo do_shortcode('[searchandfilter taxonomies="search,category,post_tag,product_cat" headings=",Categories,Tags,Product Categories"]'); ?>

日付範囲で投稿をフィルタリングする方法は？

別のケースの使用法は、訪問者が特定の日付範囲内の特定のカテゴリの投稿を検索できるようにする場合です。その場合は、次のコード行をarchive.phpに貼り付けるだけです。

<?php echo do_shortcode('[searchandfilter fields="search,post_date" types=",daterange" headings=",Post Date"]'); ?>

投稿フォーマットとページをフィルタリングする方法は？

最後の例では、投稿のフォーマットとページのフィルタリングを見てみましょう。ビデオまたはオーディオの投稿を公開する場合、このショートコードにより、訪問者は指定した投稿形式に属する投稿のみを見つけることができます。

[searchandfilter fields="search,post_format" types=",select" headings=",Post Format" submit_label="Filter"]

訪問者にページまたは投稿をフィルタリングしてもらいたい場合、必要なのは投稿タイプをパラメーターとして受け入れるショートコードだけです。

[searchandfilter fields="search,post_types" post_types="post,page" headings=",Post Types"]

上記の例とは別に、プラグインでは、結果を階層順に並べ替えたり、指定したカテゴリの投稿数を表示したり、クラスを追加したり、作成者をフィルタリングしたりするためのパラメーターを含めることで、さらに具体的にすることができます。

投稿を手動でフィルタリングする方法

WordPressに関連するものと同様に、プラグインを使用せずにそれを行う方法があります。訪問者が特定のカテゴリの投稿をフィルタリングできる単純なフォームを作成するとします。
まず、簡単なフォームを作成する必要があります。

<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
    <?php
        if( $terms = get_terms( 'category', 'orderby=name' ) ) : 
            echo '<select name="categoryfilter"><option>Select category...</option>';
            foreach ( $terms as $term ) :
                echo '<option value="' . $term->term_id . '">' . $term->name . '</option>'; 
            endforeach;
            echo '</select>';
        endif;
    ?>
    <label>
        <input type="radio" name="date" value="ASC" /> Date: Ascending
    </label>
    <label>
        <input type="radio" name="date" value="DESC" selected="selected" /> Date: Descending
    </label>
    <button>Apply filters</button>
    <input type="hidden" name="action" value="customfilter">
</form>
<div id="response"></div>

上記のフォームでは、最初の部分で、ユーザーはget_terms関数を使用して分類法を選択できます。これは、デフォルトのカテゴリとタグ、およびカスタム分類法に使用できます。次の部分では、訪問者が結果を昇順または降順で表示できるようにするラジオボタンを追加します。最後に、最後の部分は、選択したフィルターを適用できるようにするフォームのボタンです。

フォーム全体がsidebar.phpテンプレートの[外観]> [テーマ]> [エディター]に追加されました。

次のステップは、jQueryを使用して、ページをリロードせずに結果を表示できるようにすることです。

jQuery(function($){
    $('#filter').submit(function(){
        var filter = $('#filter');
        $.ajax({
            url:filter.attr('action'),
            data:filter.serialize(), // form data
            type:filter.attr('method'), // POST
            beforeSend:function(xhr){
                filter.find('button').text('Applying Filters...');          },
            success:function(data){
                filter.find('button').text('Apply filters');                $('#response').html(data); 
            }
        });
        return false;
    });
});

コードの最後のビットは、選択したフィルターに基づいて結果を処理する関数をfunction.phpファイルに追加することです。選択したカテゴリを調べ、投稿がある限り、投稿された日付の昇順または降順で表示します。カテゴリに投稿が見つからない場合は、「投稿が見つかりませんでした」というメッセージが表示されます。

 
function my_filters(){
    $args = array(
        'orderby' => 'date', 
        'order' => $_POST['date'] 
    );
 
        if( isset( $_POST['categoryfilter'] ) )
        $args['tax_query'] = array(
            array(
                'taxonomy' => 'category',
                'field' => 'id',
                'terms' => $_POST['categoryfilter']
            )
        );
  
    $query = new WP_Query( $args );
 
    if( $query->have_posts() ) :
        while( $query->have_posts() ): $query->the_post();
            echo '<h2>' . $query->post->post_title . '</h2>';
        endwhile;
        wp_reset_postdata();
    else :
        echo 'No posts found';
    endif;
 
    die();
}
 
 
add_action('wp_ajax_customfilter', 'my_filters'); 
add_action('wp_ajax_nopriv_customfilter', 'my_filters');

最終結果は、フロントエンドのように表示されます。

読者にWordPressの投稿とページをフィルタリングさせる必要がある理由

上記の方法は、ユーザーが投稿をフィルタリングできるようにするための優れた方法です。しかし、なぜあなたはそれをしたいのですか？

WordPressでは、既にカテゴリとタグを使用して投稿を整理できますが、ユーザーは一度に1つのカテゴリまたはタグしか表示できません。さらに、独自のカテゴリを使用するカスタム投稿タイプを使用する場合、それらのカテゴリは通常の投稿に使用されるカテゴリと一緒に表示されません。

Search＆Filterプラグインは、さまざまなカテゴリやタグが1年分のコンテンツとペアになっている場合だけでなく、ポートフォリオ、ギャラリー、紹介文などのカスタム投稿タイプを追加した場合にも便利です。

もう1つの例は、訪問者がこのプラグインを簡単に使用して製品をフィルタリングし、探しているものを見つけることができることです。また、コードに精通している場合は、手動でコードを実行することで、検索結果の表示方法と使用するパラメーターをさらに細かく制御できます。

まとめ

訪問者が必要なコンテンツをすばやく見つけられるようにすることで、Webサイトが使いやすいことを確認することは、快適なユーザーエクスペリエンスを提供し、戻ってくるように促すための優れた方法です。サイトにコンテンツが豊富に含まれている場合は、ページと投稿のフィルタリングを実装して、もっと見たいコンテンツを確実に取得できるようにすることを検討してください。

WordPressの検索とフィルタリングに関するご意見をお聞かせください。 以下のコメントでお知らせください。

グラフィックグローブ/shutterstock.comによる記事のサムネイル画像