WordPressの検索カスタマイズ/ドロップダウンリストで絞込み

- WordPress -
2019.11.25
WordPress

get_search_form()で出力されるWordPressデフォルトの検索フォームはこれ↓。

<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
	<label>
		<span class="screen-reader-text"><?php echo _x( 'Search for:', 'label' ) ?></span>
		<input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Search …', 'placeholder' ) ?>" value="<?php echo get_search_query() ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" />
	</label>
	<input type="submit" class="search-submit" value="<?php echo esc_attr_x( 'Search', 'submit button' ) ?>" />
</form>

この検索フォームでは、投稿・固定ページ・カスタム投稿タイプの全てが検索対象になってしまいます。

この検索フォームに書き加えることで、投稿タイプを指定しつつフリーワード検索ができるようにカスタマイズしていきます。

検索対象のカスタム投稿タイプをドロップダウンリストで選べるようにする

こんな感じ↓に、ユーザーがカスタム投稿タイプを指定してのフリーワード検索をしたい時。

WordPress検索カスタマイズ

以下8〜10行目を環境に合わせて書き換えればOK。

<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
    <label>
        <span class="screen-reader-text"><?php echo _x( 'Search for:', 'label' ) ?></span>
        <input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Search …', 'placeholder' ) ?>" value="<?php echo get_search_query() ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" />
    </label>
    <label>
        <select name="post_type" id="post_type">
            <option value="news">ニュース</option>
            <option value="product">製品</option>
            <option value="column">コラム</option>
        </select>
    </label>
    <input type="submit" class="search-submit" value="<?php echo esc_attr_x( 'Search', 'submit button' ) ?>" />
</form>