『WordPress』でカスタム投稿毎にsearch.phpを切り替える

『WordPress』でカスタム投稿毎にsearch.phpを切り替える

WordPressでサイト制作をしていると複数のカスタム投稿を使い分けるケースがたまに出て来ます。
カスタム投稿毎にCSSを含め表示が違う場合、検索結果を表示するテンプレートも切り替える必要があります。

そこでカスタム投稿毎にsearch.phpを切り替える機能を実装していきます。

検索フォームを設置する

例として『hoge』というカスタム投稿用の検索フォームの場合。

<form method="get" action="<?php echo home_url('./'); ?>" >
<input type="hidden" name="post_type" value="hoge">
<input name="s" type="text" class="search-text"><input type="image" src="<?php bloginfo('template_url'); ?>/img/search_btn.png">
</form>

name=”post_type” value=”hoge”のhogeの部分でカスタム投稿タイプを指定します。

ページ内にそのまま埋め込んでもいいのですが『hoge-searchform.php』のようにパーツ化。
<?php get_template_part(‘hoge-searchform’); ?>というようにして読み込んだ方がメンテナンスが楽だと思います。

function.phpに切り替え用のコードを記述

検索フォームで検索を行った際に表示されるページは通常『search.php』で制御されています。
検索結果を表示する際にカスタム投稿毎にテンプレートを切り替える場合は以下のコードを『function.php』に追記します。

//カスタム投稿用post_typeセット
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[] = "{$post_type}-search.php";
    $templates[] = 'search.php';
    $template = get_query_template('search',$templates);
  }
  return $template;
}

この記述をすることによってカスタム投稿『hoge』で検索した結果を『hoge-search.php』というテンプレートを使って出力することが出来るようになります。
これでカスタム投稿毎にsearch.phpを切り替えて見た目のデザイン変更が可能になりました。

search.phpの記述例

例えばこういった記述をすることが個人的には多いです。

<div id="result-wrap">

<?php
global $wp_query;
$total_results = $wp_query->found_posts;
$search_query = get_search_query();
?>
<h2>「<?php echo $search_query; ?>」の検索結果<span>(<?php echo $total_results; ?>件)</span></h2>

<?php /*?>検索内容に該当するものがあった場合<?php */?>
<?php if( $total_results >0 ): ?>
<div id="result-list">
<?php if(have_posts()):	while(have_posts()): the_post(); ?>
ループさせる内容を記述
<?php endwhile; endif; ?>
<!-- /#result-list --></div>
<!-- /#result-wrap --></div>

<?php /*?>wp_pagenavi用の記述※不要であれば削除<?php */?>
<?php if(function_exists('wp_pagenavi')){
wp_pagenavi(array('query'=>$wp_query));
}
?>
<?php wp_reset_postdata(); ?>

<?php /*?>検索内容に該当するものがなかった場合<?php */?>
<?php else: ?>
<div id="result-list">
<p><?php echo $search_query; ?> に一致する情報は見つかりませんでした。</p>
<!-- /#result-list --></div>
<!-- /#result-wrap --></div>

<?php endif; ?>

この部分で『検索ワード』の検索結果(○○件)といった表示にしています。

<h2>「<?php echo $search_query; ?>」の検索結果<span>(<?php echo $total_results; ?>件)</span></h2>

よく使うwp_pagenavi用の記述、検索結果が0件の時の出力内容などを記述してますが、このあたりは出力したい内容によって変更してください。
参考までに。

SPONSORED LINK

CONTACT

ご意見やご感想、お仕事のご依頼など
お気軽にご連絡ください。

CONTACT FORM