ホームページ制作・SEO対策 福岡のアイドットデザイン。Webマーケティングのご相談も承ります。

お問い合わせ・ご相談はコチラ

blog

ブログ

WordPressで作ったWebサイトに検索フォームを設置する方法

| カテゴリー : WordPress

WordPressで制作したWebサイトはコンテンツの更新が簡単なので、まじめに更新を重ねていけばすぐに100本、200本の記事数を作ることができます。

コンテンツの数が増えてきたとき、サイト上にあると便利なのが検索フォームです。

検索フォームがあればサイト内のコンテンツをキーワード入力で探すことができるので、何ページもアーカイブを辿っていく手間が省けてユーザーにもやさしいホームページになります。

get_search_formで検索フォームを設置

WordPressには検索フォームを設置するためのget_search_formという便利な関数があります。

テンプレートの好きな箇所に以下の1行を書き加えれば、その場所に検索フォームが表示されるようになります。

とてもシンプルで簡単ですよね?

ただ、このままではWordPressデフォルトの検索フォームが出力されるだけなので、もう少しカスタマイズを考えていきましょう。

searchform.phpでオリジナル検索フォームを作成する

検索フォームに独自のclassを設定して装飾を加えたり、要素を追加したい場合には検索フォームをカスタマイズする必要があります。

そんな時はテーマフォルダ内にsearchform.phpというテンプレートを用意しましょう。

このテンプレートを作成しておくと、get_search_form関数を実行したときにsearchform.phpの内容が読み込まれるようになります。

次のコードはWordPressデフォルトの検索フォームのコードですので、参考にしてsearchform.phpにカスタマイズしたコードを書きましょう。

searchform.phpカスタマイズで気をつけたいのは次の2点です。

  • form要素のaction属性にはWordPressのホームURLを指定
  • name属性がsのinput要素、そのinput要素に対するlabelを含める

WordPressの検索フォーム設置についてもっと詳しく知りたい方はWordPress Codexに情報がありますのでご確認ください。

以上、WordPressで作ったWebサイトに検索フォームを設置する方法でした。

 

アイドットデザインのブログはWeb業界の話題に限らず幅広いビジネストピックについて書いています。
よろしければFacebookページのフォローをどうぞ!ビジネスに役立つ情報をお届けします!

福岡のホームページ制作・SEO対策はアイドットデザインまでご相談ください!
インターネット集客やWebマーケティングのご相談も承ります。

お気軽にお問い合わせください!

お見積りやご相談は、メール/お電話にてお気軽にご連絡ください。専属の担当者が丁寧にご対応いたします。