the_search_query()

the_search_query()とは？

the_search_query()の概要

the_search_query() は、WordPress の検索結果ページでユーザーが入力した検索語句（クエリ）をHTMLエスケープして出力（echo）する関数です。
検索フォームの <input> 要素に検索語句を再表示したり、検索キーワード付きの見出しやタイトルを動的に生成する際に利用されます。

the_search_query()の基本構文

<?php the_search_query(); ?>

この関数を使うと、検索クエリ文字列を画面上に表示できます。echo による出力関数なので、返り値はなく、値の取得には別の関数（後述）を使用します。

the_search_query()の主な用途と表示例

1. 検索フォームで検索キーワードを再表示

検索フォーム内で、ユーザーが入力した検索語句を <input> に表示するために次のように使います：

<form method="get" action="<?php echo esc_url(home_url('/')); ?>">
  <input type="text" name="s" value="<?php the_search_query(); ?>" />
  <input type="submit" value="検索" />
</form>

これにより、ユーザーが前回入力した検索キーワードがそのまま再表示されます。

2. ページタイトルに検索語句を表示

<h1>「<?php the_search_query(); ?>」の検索結果</h1>

検索結果ページで、検索語句を見出しなどに表示できます。

検索語句の取得には get_search_query()

the_search_query() は画面出力を行う関数ですが、値として取得したい場合は get_search_query() を使用します。

$keyword = get_search_query();

the_search_query()の内部処理（ソースコード）

WordPress コアファイル内（wp-includes/general-template.php）では、the_search_query() の中身は次のように定義されています：

function the_search_query() {
  echo esc_attr( get_search_query() );
}

つまり、

• get_search_query() で生の検索語句を取得し、
• esc_attr() によって HTML属性用にエスケープして、
• その値を echo で出力しています。

esc_attr() によるエスケープの理由

検索語句はユーザーが自由に入力できるため、セキュリティ上の理由で HTMLタグや特殊文字を無害化 する必要があります。
たとえば、検索欄に <script> を入力されたとしても、esc_attr() により以下のように変換されます：

<script>

これにより、XSS（クロスサイトスクリプティング）対策がなされ、安全に出力されます。

the_search_query()の検索クエリの処理の流れ

WordPress では検索フォームで s パラメータが送信されると、自動的に検索クエリが処理されます。

例：
検索フォームから次のようなクエリが送られた場合：

https://example.com/?s=料理教室

このとき、WordPress は内部的に $wp_query->query_vars['s'] に検索語句 料理教室 を格納します。
その値を get_search_query() が取得し、the_search_query() が出力するという流れになります。

the_search_query()のよくある使い方の例

検索結果ページのカスタム見出し

<?php if ( have_posts() ) : ?>
  <h2>「<?php the_search_query(); ?>」の検索結果：</h2>
<?php else : ?>
  <h2>「<?php the_search_query(); ?>」に一致する記事はありませんでした</h2>
<?php endif; ?>

検索ワードに応じた動的なタイトル表示ができます。

the_search_query()のフォームカスタマイズ例

検索結果をカスタム投稿タイプにも対応させたい場合のフォーム例：

<form method="get" action="<?php echo esc_url(home_url('/')); ?>">
  <input type="hidden" name="post_type" value="custom_type" />
  <input type="text" name="s" value="<?php the_search_query(); ?>" placeholder="検索キーワード" />
  <input type="submit" value="検索" />
</form>

このようにして、検索時に the_search_query() を使うことで、ユーザーに検索体験の一貫性を持たせることができます。

the_search_query()のカスタムエスケープの例

HTMLエスケープではなく URLエンコードされた検索語句 を取得したい場合など、以下のように rawurlencode() などと組み合わせることも可能です：

$url_encoded_keyword = rawurlencode( get_search_query() );

SEOへの影響

検索クエリを <title> や <meta> タグに含めることで、内部検索ページの最適化やユーザーエクスペリエンスの向上につながります。ただし、検索結果ページは通常 Google のインデックス対象から除外する設定になっていることが多いため、意図的にインデックス化したい場合は robots メタタグなどで制御する必要があります。

the_search_query()のまとめ

the_search_query() は非常にシンプルな関数ですが、検索体験の質を高めるために重要な役割を果たします。ユーザーの入力した内容を動的に表示することで、「自分の検索が反映されている」という安心感や、使いやすさを提供できます。

特に、検索フォームとの連携においては必須とも言える関数なので、検索機能を持つすべてのWordPressサイトでの使用をおすすめします。