プラグインいらず！WordPressで簡単にサイト内検索機能を実装する方法

2017年4月28日

当ブログはWordPressで作成されているのですが、最近まで検索機能をつけておらずやっぱりサイト内検索があった方が便利だ！と、ブログ開設から1年経った今さらながら思ったので、検索機能を実装することにしました。

調べてみるとプラグインを使って実装する方法が多く紹介されていたのですが、僕の場合はキーワード検索のみができればいいと思ったのでプラグインを使わなくても簡単に実装できる方法を選択しました！

下記に検索機能の実装方法を記載しますので、どなたかの参考にでもなれば幸いです。

検索機能に必要な関数

<?php get_search_form(); ?>

1	<?php get_search_form(); ?>

極論、このget_search_form()関数を検索フォームを表示したい箇所に記述するだけで検索機能が実装できます！笑

しかし、上記の関数のみだと下のような味気ないデフォルトの検索フォームが表示され、カスタマイズもできないので寂しい感じに、、、

これだとさすがに検索する気がなくなるので、もう一手間加えて自分好みの検索フォームに変えていきたいと思います！
そこで「searchform.php」というテンプレートを作って、使用しているthemesディレクトリ直下に入れてあげます。

searchform.phpテンプレートを作ることで、先ほどのデフォルトの検索フォームからカスタマイズができるようになります。
簡単に言うと、classをつけてcssを適用できるようにするって感じですかね。
そのsearchform.phpテンプレートの中身はこのように記述します。

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div>
<label class="screen-reader-text">キーワードで探す</label>
<div class="serchformWrap">
<input type="text" value="" name="s" id="s" class="searchEl searchText" placeholder="search" />
<input type="submit" id="searchsubmit" class="searchEl searchBtn" value="検索する" />
</div>
</div>
</form>