目次
こんにちは、後藤です。
今回は、WordPressにサイト内投稿ページ検索機能を追加する方法を紹介します。
この機能を追加することで、キーワードでサイト内の投稿ページを検索することが出来るようになります。
特定の投稿を絞らない検索機能
まずは、特定の投稿タイプを絞らない検索機能の追加方法です。
投稿や固定ページ、カスタム投稿から検索されます。
検索フォーム
検索キーワードを入力するためのフォームを作成します。
ページのテンプレートに直接記述するか、searchform.phpを作成し記述し<?php get_search_form(); ?>で読み込みます。
|
1 2 3 4 |
<form method="get" action="<?php echo home_url('/'); ?>" > <input type="text" name="s" id="s" placeholder="検索キーワードを入力"/> <button type="submit">検索する</button> </form> |
検索キーワードを入力するテキストフィールドのname属性は”s”に指定する必要があります。
検索結果表示ページ
search.phpを作成し、検索結果表示ページに表示させる内容を記述します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<?php global $wp_query; $total_results = $wp_query->found_posts;//該当件数を取得 $search_query = get_search_query();//検索キーワードを取得 query_posts($query_string.'&posts_per_page=10');//表示件数を指定 ?> <h1><?php echo $search_query; ?>の検索結果（<?php echo $total_results; ?>件）</h1> <?php if( $total_results > 0 )://該当ありの場合 if(have_posts()): ?> <ul> <?php while(have_posts()): the_post(); ?> <li> <a href="<?php the_permalink(); ?>"> <h2><?php the_title(); ?></h2> <p><?php the_excerpt(); ?></p> </a> </li> <?php endwhile; ?> </ul> <?php endif; ?> <?php else: //該当なしの場合 ?> <h2><?php echo $search_query; ?>に一致する情報は見つかりませんでした。</h2> <?php endif; ?> |
特定の投稿を絞る検索機能
次に、特定の投稿タイプを絞る検索機能の追加方法です。
投稿のみ、固定ページのみ、特定のカスタム投稿のみといった絞り込みが可能です。
カスタム投稿の検索機能を追加するには、以下の記述をfunction.phpへ追加します。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
//カスタム投稿の検索機能追加 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; } |
検索フォーム
検索キーワードを入力するためのフォームを作成します。
ページのテンプレートに直接記述するか、searchform-投稿タイプ.phpを作成し記述し<?php get_template_part( ‘searchform’,‘投稿タイプ’ ); ?>で読み込みます。
|
1 2 3 4 5 |
<form method="get" action="<?php echo home_url('/'); ?>" > <input type="text" name="s" id="s" placeholder="検索キーワードを入力"/> <input type="hidden" name="post_type" value="投稿タイプ"> <button type="submit">検索する</button> </form> |
テキストフィールドのname属性を”s”に指定するのは一緒です。
ポイントはtype=”hidden”のvalue=”投稿タイプ”の部分で投稿タイプを指定します。
投稿ならvalue=”post”、固定ページならvalue=”page”、カスタム投稿ならvalue=”カスタム投稿タイプ”を指定します。
検索結果表示ページ
search-投稿タイプ.phpを作成し、検索結果表示ページに表示させる内容を記述します。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<?php global $wp_query; $total_results = $wp_query->found_posts;//該当件数を取得 $search_query = get_search_query();//検索キーワードを取得 query_posts($query_string.'&posts_per_page=10');//表示件数を指定 ?> <h1>投稿タイプの<?php echo $search_query; ?>の検索結果（<?php echo $total_results; ?>件）</h1> <?php if( $total_results > 0 )://該当ありの場合 if(have_posts()): ?> <ul> <?php while(have_posts()): the_post(); ?> <li> <a href="<?php the_permalink(); ?>"> <h2><?php the_title(); ?></h2> <p><?php the_excerpt(); ?></p> </a> </li> <?php endwhile; ?> </ul> <?php endif; ?> <?php else: //該当なしの場合 ?> <h2><?php echo $search_query; ?>に一致する情報は見つかりませんでした。</h2> <?php endif; ?> |
まとめ
今回はWordPressでサイト内投稿ページ検索機能を追加する方法を解説しました。
気をつけるポイントとしては、検索フォームのテキストフィールドのname属性を”s”に指定しないと動かないことです。
投稿タイプを絞るには、検索フォームに
<input type=”hidden” name=”post_type” value=”投稿タイプ”>
を追加します。
