当サイト、Codex 日本語版は今後積極的な更新は行わない予定です。後継となる新ユーザーマニュアルは、https://ja.wordpress.org/support/ にあります。
万が一、当サイトで重大な問題を発見した際などは、フォーラムWordSlack #docs チャンネルでお知らせください。</p>

検索ページの作成

提供: WordPress Codex 日本語版
2010年4月13日 (火) 09:30時点におけるMizuno (トーク | 投稿記録)による版 (翻訳済み。画像無し。「検索フォームを含む(検索のための専用の)ページの作成」)

移動先: 案内検索

このページ「検索ページの作成」は未翻訳です。和訳や日本語情報を加筆してくださる協力者を求めています

ページ名検討中: このページ名「検索ページの作成」について改名が提案されています。ご意見をお寄せください。

検索ページは、カスタムページテンプレートの WordPress ページで、検索した訪問者にいろいろな情報を提供します。

知っておくべきこと

異なる WordPress テーマは、異なるテンプレートファイルを有しています。search.php テンプレートファイルが含まれているテーマもあります。これは、「検索ページ」ではありません。検索結果を表示するページです。searchform.php というテンプレートファイルもあります。このテンプレートは、サイドバーに入れられていることがよくあり、検索ボックスフォームを生成します。テーマに無い場合は、デフォルトテーマからコピーすることができます。

オリジナルのカスタム検索ページを作成するには、ページテンプレートを作成し、検索フォームと、検索する前に訪問者に知らせたい情報とを含めます。

WordPress テーマに page.php テンプレートファイルが含まれいているかどうかを調べてください。デフォルト WordPress テーマにはこのテンプレートが含まれていますが、そうでないものも多くあります。含まれている場合は、こちらの説明にしたがってください。含まれていない場合は、オリジナルを作成するために必要な情報をごらんください。

page.php を使用する

1. テキストエディタを使用して page.php を開き、searchpage.php という名前で保存します。(注: ファイル名 search.php は特別なテンプレート名として予約されています。このファイル名は避けてください。提案している searchpage.php はファイルリストで認識しやすいでしょう。)

2. 保存したら、このファイルを編集します。

  • The Loop を削除し(基本的に、コンテンツ div 内にあるもの全て)、div タグを残します。
  • 検索投稿等の heading を追加します。CSS スタイルシートの既存クラスを使用するか、新規作成してください。
  • コンテンツ div あるいはページコンテンツを含む他の div に以下をコピーしてください。
<?php include (TEMPLATEPATH . '/searchform.php'); ?>
  • searchpage.php の一番最初に以下を追加すると、管理画面で WordPress が検索ページとして認識します。
<?php
/*
Template Name: Search Page
*/
?>
  • ファイルを保存します。
  • ファイルをテーマディレクトリにアップロードします (style.css スタイルシートを変更した場合は、このファイルもアップロードしてください)。
  • In the Administration Panels go to Write > Write Page.
    ファイル:writepage2 5.png
    WordPress Write Page Panel
  • In the title field enter Search.
  • Do not write anything in the content area.
  • From the Page Template drop-down menu select: Search Page
  • Click the Create New Page button
  • Select the Manage Pages panel.
  • Write down the page_id number of your newly created Page named Search Page.

(訳注: WP2.5 の管理画面での操作。要更新 --Mizuno 2010年4月12日 (月) 23:31 (UTC))

これで、検索ページの外観をカスタマイズする準備ができました。

検索ページテンプレートを作成する

もし page.php が無い場合は、テーマの index.php テンプレートファイルを元にして作成できます。

  1. テキストエディタで、テーマの index.php を開き、searchpage.php という名前で保存します。
  2. 上記ステップにしたがって編集します。

検索ページ結果の保存とページ分割

検索テンプレートをカスタマイズすると、結果とページ分割が上手く動作しないかもしれません。これらを解決するには、まず検索テンプレートに以下のコードを追加し、元の WordPress クエリが保持されるようにします。クエリをカスタマイズするには、追加の引数を (array) $search_query に付加します。新規 $wp_query オブジェクトで $search_query を実行します。WP_Query オブジェクトについての詳細は、http://codex.wordpress.org/Function_Reference/WP_Query を参照してください。

<?php
global $query_string;

$query_args = explode("&", $query_string);
$search_query = array();

foreach($query_args as $key => $string) {
	$query_split = explode("=", $string);
	$search_query[$query_split[0]] = $query_split[1];
} // foreach

$search = new WP_Query($search_query);
?>

カスタマイズする引数は、http://codex.wordpress.org/Template_Tags/query_posts を参照してください。

検索合計数を表示する

検索結果の合計数にアクセスするには、wp_query オブジェクトを使用して投稿の合計数を保持してください。

<?php
global $wp_query;
$total_results = $wp_query->found_posts;
?>

WP Query についての詳細は http://codex.wordpress.org/Function_Reference/WP_Query を参照してください。

検索ページにリンクする

カスタム検索ページへリンクするには、いくつかの方法があります。

ページ ID を使用する 
パーマリンクを使用する/しないに関わらず、ページ ID 番号を使用して新しい検索ページにリンクできます。
<a href="index.php?page_id=17" title="Search Page">Search Page</a>

あるいは、

<a href="<?php bloginfo('url'); ?>/?page_id=17">Search Page</a>
ページスラッグを使用する 
ページスラッグは ページ編集 パネルで設定します。パーマリンクを使用しているときはページ名です。手作業で変更することもできます。ページスラッグを使用した例は、
<a href="/wordpress/search-page" title="Search Page">Search Page</a>

あるいは

<a href="<?php bloginfo('url'); ?>/wordpress/search-page" title="Search Page">Search Page</a>
wp_list_pages() を使用する 
wp_list_pages() テンプレートタグを使用している場合は、ページ一覧に自動生成されます。

検索ページをカスタマイズする

これでカスタム検索ページが作成できました。表示をカスタマイズできます。ページ パネルのカスタム検索ページの行で 編集 を選択してください。あるいはテキストエディタで searchpage.php を開き、編集してください。

searchform.php のコンテンツ div 内の include 関数の上に、訪問者が検索する助けとなるテキストを追加できます。

<p>
My Site features articles about 
<a title="WordPress Articles" href="index.php?cat=4">WordPress</a>, 
<a title="Web Design Articles" href="index.php?cat=5">web page design</a>, 
<a title="Development Articles" href="index.php?cat=6">website 
development</a>,
and <a title="CSS Articles" href="index.php?cat=7">CSS</a>.
</p>
<p>To search my website, please use the form below.</p>

<?php include (TEMPLATEPATH . '/searchform.php'); ?>

キーワードリストあるいはその他の情報、画像、カスタマイズの詳細等を追加してもよいかもしれません。

最新英語版: WordPress Codex » Creating a Static Front Page最新版との差分

この記事は翻訳時に編集が必要であるとマークされていました。その為Codex原文が大きく編集されている可能性があります。内容を確認される際は原文を参照していただき、可能であれば本項目へ反映させてください。よりよいCodexを作成するためのお手伝いをお願いします。