カスタム投稿用の検索機能を追加

カテゴリー: タグ: ,


wordpressの通常検索は、何も設定しなければサイト全体で検索し、結果を表示します。
それはそれでいいのですが、カスタム投稿を設置していると、カスタム投稿内のみで検索・結果が出ると何かと便利だと思います。
ですがそれなりの設定が必要になりますので、今回はカスタム投稿内のみで動く検索フォーム設置方法を備忘録として書き留めます。
必要なファイルや作業としては

カスタム投稿名をtestとした場合

・カスタム投稿用の検索フォーム作成=searchform-test.php
・カスタム投稿用の検索結果ページ作成=search-test.php
・function.phpに追記
・cssに追記

となります。
※上記「test」部分が個々で異なりますのでご自身の設定に合わせてください。




カスタム投稿用の検索フォーム作成

検索フォームが元々ある場合、平均して searchform.php が設置されていますので、コードをコピーし、ファイル名を searchform-test.php にしてください。
(下記は平均して備わっているsearchform.phpの中身です)

<form role="search" method="get" class="searchform" action="<?php echo esc_url( home_url( '/')); ?>">
	<input type="text" placeholder="キーワード検索" name="s" class="searchfield" value="" />
	<input type="submit" value="click" alt="検索" title="検索" class="searchsubmit" />
</form>

上記を下記の通り修正していきます。

・2行目の【value=""】→【value="<?php the_search_query(); ?>"】
・2~3行目に1行追加【<input type="hidden" name="post_type" value="test">】

2行目のname=”s”は必須なので消さないように。
追加した1行はカスタム投稿testのみで検索しますという意味です。
※【】は入れないように。
これらをまとめたのが下記です。

 searchform-test.php 
<form role="search" method="get" class="searchform" action="<?php echo esc_url( home_url( '/')); ?>">
	<input type="text" placeholder="キーワード検索" name="s" class="searchfield" value="<?php the_search_query(); ?>" />
	<input type="hidden" name="post_type" value="case">
	<input type="submit" value="click" alt="検索" title="検索" class="searchsubmit" />
</form>


カスタム投稿用の検索結果ページ作成

空のsearch-test.phpを用意し、まずはコピペしてください。
その後【test】と書かれている部分を個々のポストタイプ名に書き換えてください。

 search-test.php 

<p>検索結果:<?php the_search_query(); ?></p>
	<?php
		$args = array(
			'post_type' => get_query_var( 'post_type', 'test' ),
			'posts_per_page' => 10, //表示数
			'paged' => get_query_var( 'paged', 1 ), //ページングする場合には記載
			'order' => 'DESC', //降順
			'orderby' => 'date', //日付でソート
			's' => get_search_query() //name="s"のです
		);
		$wp_query = new WP_Query($args);
			if ( $wp_query->have_posts()): while ( $wp_query->have_posts()): $wp_query->the_post();
	?>
	//検索結果に引っかかった内容を表示する
	<?php endwhile; ?>
		<?php else: ?>
			//検索結果に引っかからなかった場合の内容を表示する
			<p>キーワードはみつかりません。</p>
		<?php endif; ?>
	<?php wp_reset_postdata(); ?>


function.phpに追記

現在動いているfunction.phpに追記してください。

 function.php 

//カスタム投稿タイプごとに検索結果のテンプレートを作成
add_filter('template_include','custom_search_template');
function custom_search_template($template){
  if ( is_search() ){
    $post_types = get_query_var('post_type');
    foreach ( (array) $post_types as $post_type )
    $templates[] = "search-{$post_type}.php";
    $templates[] = 'search.php';
    $template = get_query_template('search',$templates);
  }
  return $template;
}


css

個々の表示デザインに合わせてcssを追加してください。


予備

元々、wordpressの検索システムは、
・投稿記事のタイトル
・投稿記事の抜粋分
・投稿ページの本文
・固定ページ本文
から検索するよう組まれているようです。
よってカスタム投稿を作成した場合のカスタム投稿専用検索システムは新たに設置しなければいけないということだそうです。 (こちらの 参照ページに詳しく記載してくださっています。)
まだまだ勉強しなければいけないことが山程あり、なかなか手が回らないのが実情です。


品川区の武蔵小山、目黒不動前、五反田駅、目黒駅近隣にて、web制作を軸にひとり稼業にて活動しております。
・wordpressの学校に通っているけど実は授業についていけてない
・wpを独自で勉強しているけど基本的なことを理解していない
・そもそもワードプレスの使い方がわからない
・これからwebの世界に入りたい
等など、ご相談、お困りのことがございましたらお気軽にご連絡ください。
個々に対応いたします。