1分で実装!WordPressのサイト内検索で未入力で検索した場合の挙動の実装方法

投稿日:2024年04月14日(日) 更新日:2024年04月15日(月)
1分で実装!WordPressのサイト内検索で未入力で検索した場合の挙動の実装方法|UMENOKI|すぐに仕事で使えるIT技術情報メディア

みなさんこんにちは!エンジニアの高澤です!

今回はWordPressのサイト内検索で未入力で検索した場合の挙動の実装方法について解説していきたいと思います。

今回の内容は意外と見落としがちなサイト内検索の未入力の場合の挙動ということで、マニアックな内容にはなりますが割と必須の実装ともいえるかと思います。

決して難しくはないので、お仕事で実装したい場合は当記事をご確認いただきサクッと実装していただけますと幸いです。

今回の実装がなぜ必要なのか?

今回の実装がなぜ必要なのかというと、未入力で検索した場合「すべての記事が表示されてしまう」からです。

また、今回の実装対応がなされていないことによってユーザーは混乱し、記事を検索できているのかできていないのかがわかりにくく混乱させてしてしまう可能性があります。

そのため、サイトの使いやすさを向上させるという意味でも今回の対応は必要だと考えます。

実装する方法

それでは早速検索キーワード未入力の場合の実装方法について解説していきたいと思います。

まずは以下のコードをsearch.php(もしくはご自身で作成された検索結果を出力するPHPテンプレートファイル)にコピー&ペーストしてください。

<?php
if(isset($_GET['s']) && empty($_GET['s'])):
?>
    <p>検索キーワードが入力されていません。</p>
<?php
else:
?>
    <!-- ここにWordPressループの処理を記述 -->
<?php
endif;
?>

上記のコードはif文で検索結果出力時に検索キーワードのありなしで処理を振り分けているコードになります。

検索キーワードがある場合はif文の条件がfalseになって記述しているWordPressループの処理が出力されて検索結果の記事一覧が表示されます。

逆に検索キーワードがない場合は「検索キーワードが入力されていません。」というテキストが表示されるようにしております。

if文の条件処理の部分については、PHPのスーパーグローバル変数の$_GET変数を使用して、検索処理時のURLにあるパラメータであるGETメソットで送信されたデータを取得して条件分岐しております。

取得するパラメータ名は「s」で、例えば、http://example.com/?s=search_textのようなURLであれば、「search_text」が「s」キーのデータとして$_GET[‘s’]で取得することが可能です。

ちなみに「s」はWordPressの標準機能として用意されている検索機能で必要なパラメータ名になります。

if文の条件分岐では、isset()関数を使ってGETパラメーターの「s」が存在し、かつその値が空である場合に真(true)となり「検索キーワードが入力されていません。」というテキストが表示されるようになっております。

まとめ

WordPressのサイト内検索で未入力で検索した場合の挙動の実装方法について解説は以上になります。

今回の内容はサイト内検索の未入力の場合の挙動ということで、マニアックであるが故に意外と見落としがちな部分になってくるかと思います。

ですが筆者の経験上必要になるケースは結構多いかと思います。

よろしければぜひ当記事をお仕事でご活用いただきましたら幸いです。

執筆者

UMENOKI編集部 高澤 翔汰

歴5年目(2024年8月以降から5年目です)のエンジニアです!
CMSでのサイト構築とWebデザイン制作を兼任して5年目になります。
自作のiOSアプリ(iPhoneアプリ)やWordPressプラグインを開発することもあり、まだまだ現在進行形で勉強中です!

お気軽に皆さんのご要望をお聞かせください!

どんなに些細なことでも構いません!よろしければ記事や当サイトへの「こんな記事があったら仕事とかで役に立つな〜」や「こうだったらもっと役に立つのに!」といったようなご要望等をお気軽にお聞かせください!今後のサービス改善にお役立てさせていただきます!

例1)Reactの技術記事を書いてほしい!
例2)WordPressの使い方とかを初心者向けに解説してほしい!...など

送信と同時にプライバシーポリシーに同意したものとします。
サンタさん