WordPressに検索フォームを追加する方法【初心者向け】

WordPressに【検索フォーム】を追加する方法を初心者向けに解説した記事です。サイトのページ数が増えてきたら、回遊性をアップさせるために有効な手段です。WordPressでは、ウィジェット機能から簡単に追加することかできます。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

WordPressで制作したWebサイトのページ数が増えてきたら、訪問したユーザーのことを考えて、サイト内に「検索フォーム」があると便利です。

閲覧したサイトで使ったことがある人も、多いのではないでしょうか。

検索フォーム1

検索フォームを導入すると、サイトの使い勝手がアップするので、ユーザーの回遊性(サイトの様々なページをみてもらうこと)が向上します。

 

WordPressで検索フォームを設置するのに、特殊なコードを書いたりする必要はありません。

もちろん、細かいデザインや機能を設定したいひとは1から作成することができますが、初心者でも簡単に取り入れられるよう、デフォルトで機能が準備されています。

今回は、初心者でも簡単に検索フォームを導入する方法をお知らせします。

 

なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。

 

大石ゆかり

田島メンター!!WordPressの記事数が増えてきてしまって、検索機能をつけたいんですけど、どうすればいいんですか?

田島悠介

ウィジェットを追加すればできるよ。やり方を教えてあげるね。

大石ゆかり

はい、お願いします!!

 

ウィジェット編集画面を開く

「検索フォーム」は、WordPressに標準装備されているウィジェット機能で導入することができます。

ダッシュボード>外観>ウィジェットをクリックしましょう。

ウィジェットの管理画面が開きます。
検索フォーム2

 

 

検索フォームウィジェットを追加

ウィジェット管理画面は、左に追加可能なウィジェットの一覧、右に使用中のウィジェット一覧という表示構成になっています。

検索フォーム3

 

この中から、「検索フォーム」というウィジェットを探しましょう。

TwentyTwelveのテーマでは、下の方に表示されていました。

検索フォーム4

 

ウィジェットを追加するときは、ウィジェットの一覧エリア(左)から、使いたいウィジェットを使用中エリア(右)にドラック&ドロップで移動させるだけです。

今回は、サイドバーに表示させたいので、「メインサイドバーエリア」部分にドラック&ドロップで移動させてみましょう。

検索フォーム5

 

検索フォームにタイトルを付けたい場合は、ここで編集して「保存」をクリックします。

検索フォーム6

 

設定が終わったらサイト上で確認すると、検索フォームが表示されていることがわかります。

検索フォーム7

今回の記事は以上です。ぜひ自分でも実装してみてください。

さらにWordPressを使いこなしたい場合は、WordPressで固定ページにテンプレートを適用する方法も合わせてご覧ください。

 

大石ゆかり

これで検索してもらえるようになりました♪

田島悠介

検索があると、サイト回遊率が上がってよりみてもらえる機会が増えるから良いね♪

大石ゆかり

はい、そうですね♪

 

[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。