投稿一覧に、独自の検索フォームを追加する方法を紹介します。

やること

ACFで作成したカスタムフィールドの値を、投稿一覧から絞り込み検索できる検索フォームを追加します。

目次へ戻る

投稿一覧の絞り込み検索に検索フォームを追加します。

◯利用するフック
アクションフックのrestrict_manage_postsを利用します。

コード例

// 検索フォームを追加します。
function add_restrict_manage_posts( $post_type ) {
    if ( $post_type !== 'test_search' ) {
        return;
    }

    // 検索フォームのvalueにセットする値
    $group_name = $_GET['group_name'];

    // 表示する検索フォームのhtml
    ?>
    <div>
        <label>グループ名 <input type='text' name='group_name' value='<?php echo esc_attr( $group_name ) ?>'></label>
    </div>
    <?php
}

注意ポイントですが、
html属性値に、変数をechoする場合には、エスケープする関数esc_attrを忘れないようにしてください。
クロスサイトスクリプティングの対策になります。

目次へ戻る

検索フォームに入力した値で検索できるように検索クエリを書き換えます。

◯利用するフック
アクションフックのpre_get_postsを利用します。

コード例

// 検索クエリを書き換える。
function search( $query ) {
    global $pagenow;

    if ( $query->get( 'post_type' ) !== 'test_search' ) {
        return;
    }

    // 投稿一覧でのみクエリの書き換えを行う。
    if ( $pagenow === 'edit.php' && is_admin() && $query->is_main_query() ) {
        $args = $query->get( 'meta_query', [] );

        if ( isset( $_GET['group_name'] ) && strlen( $_GET['group_name'] ) ) {
            $args[] = [
                'key'     => 'group_name',
                'value'   => $_GET['group_name'],
                'compare' => '=',
            ];
        }
        $query->set( 'meta_query', $args );
    }
}
目次へ戻る

全体のソースコード

<?php

class Test_Search {

    const POST_TYPE_NAME = 'test_search';

    public function __construct() {
        add_action( 'restrict_manage_posts', [ $this, 'add_search_field' ] );
        add_action( 'pre_get_posts', [ $this, 'search_posts' ] );
    }

    // 検索フィールドを追加する。
    public function add_search_field( $post_type ) {
        if ( $post_type !== self::POST_TYPE_NAME ) {
            return;
        }

        $group_name = $_GET['group_name'];

        ?>
        <div>
            <label>グループ名 <input type='text' name='group_name' value='<?php echo esc_attr( $group_name ) ?>'></label>
        </div>
        <?php
    }

    // 検索クエリを書き換える。
    public function search_posts( $query ) {
        global $pagenow;

        if ( $query->get( 'post_type' ) !== self::POST_TYPE_NAME ) {
            return;
        }

        // 投稿一覧でのみクエリの書き換えを行う。
        if ( $pagenow === 'edit.php' && is_admin() && $query->is_main_query() ) {
            $args = $query->get( 'meta_query', [] );

            if ( isset( $_GET['group_name'] ) && strlen( $_GET['group_name'] ) ) {
                $args[] = [
                    'key'     => 'group_name',
                    'value'   => $_GET['group_name'],
                    'compare' => '=',
                ];
            }
            $query->set( 'meta_query', $args );
        }
    }

}

new Test_Search();
目次へ戻る

作成した検索フィールドで検索してみます。

グループ名に検索したい値を入力して、絞り込み検索ボタンをクリックします。

検索後


検索フィールドに入力した値で検索されていることが確認できました。

目次へ戻る

最後に

変数をechoする場合には常に適切なエスケープ処理を行いましょう。
絞り込み検索する方法を紹介する記事があまりなかったため、参考記事として書きました。

目次へ戻る
この記事をシェアする:

東日本橋の制作・開発会社 プレスマンのスタッフブログ