このサイトhttp://www.brooklynparlor.co.jp/のようなBOXを設置したいです。
どこにどう書けばいいのか教えてください。
サイト内の検索が出来るような仕組みは何種類か存在しますので、順に紹介します
というわけで、順に代表的なものを紹介します。
私がオススメするのは、Google カスタム検索です。メンテナンスの必要が無い上にサーバへの不可もかからないというのは、長期的に利用することを考えた場合、大きな利点となります。
Grep型やインデクス型を使いたい場合、私が挙げたもの以外にも種々公開されていますので、『全文検索 CGI』等のキーワードで検索してみると良いと思います。
一般論ですが、HTML中の検索ボックスを設置したい場所に書けばいいと思います。ページがマルチカラムであれば、メインでないカラムの上のほうに設置すればビジターが使い易いのではないかと思います。
ものによって違うので『こうだよ』とは言えないのですが、だいたい以下のような感じになると思います。スクリプトを導入するにせよ外部サービスを使うにせよ、ほぼ変わりません。
<form action="cgi の相対URL もしくは外部サービスのアドレス" <input type="text" size="30(適当な値)" name="指定された値"value="" /> <input type="submit" value="Search!" /> </form>
サイト内の検索が出来るような仕組みは何種類か存在しますので、順に紹介します
というわけで、順に代表的なものを紹介します。
私がオススメするのは、Google カスタム検索です。メンテナンスの必要が無い上にサーバへの不可もかからないというのは、長期的に利用することを考えた場合、大きな利点となります。
Grep型やインデクス型を使いたい場合、私が挙げたもの以外にも種々公開されていますので、『全文検索 CGI』等のキーワードで検索してみると良いと思います。
一般論ですが、HTML中の検索ボックスを設置したい場所に書けばいいと思います。ページがマルチカラムであれば、メインでないカラムの上のほうに設置すればビジターが使い易いのではないかと思います。
ものによって違うので『こうだよ』とは言えないのですが、だいたい以下のような感じになると思います。スクリプトを導入するにせよ外部サービスを使うにせよ、ほぼ変わりません。
<form action="cgi の相対URL もしくは外部サービスのアドレス" <input type="text" size="30(適当な値)" name="指定された値"value="" /> <input type="submit" value="Search!" /> </form>
ありがとうございます!googleカスタム検索が便利そうなのですが、表示されている検索ボックス内に「googleカスタム検索」と薄字で入っているのが格好わるくて(僕のサイトはデザイン系サイトなので。)、外せないのでしょうか?
(一応、googleのコントロールパネルで試してみました。)
また、外せるのであれば、ボックスのデザインをbrooklynparlor.co.jp/にあるような、オリジナルデザインに変更することは手間がかかる作業になるのでしょうか?
ちなみに、この上記のサイトはどのような、検索のやり方になっているのかお分かりでしたら、教えてやってください。
(このサイトのページ構造を参考にサイトを作っております。)
追加情報ということで。
http://www.brooklynparlor.co.jp/ を見る限り、当該サイトは Wordpress で構築されているようです。このサイトが利用している検索システムに関してですが、ソースを覗いてみたところ、検索フォーム部分の form 要素のaction 属性がサイトのトップページの URL となっていましたので、Wirdpress にそもそも検索機能がついているとすれば、それかもしれないです。そうでないとしたら、これ以上は管理人の人に直接聞いてみないと分からなさそうです。
カスタム検索を利用する際に気になるというインプットボックスの背景画像ですが、ソースを見てみたところ、単に CSS で background-image を指定しているだけなようですので、CSS で当概要素に background-image: none!important などと書いておけば良いと思います。
見栄えを細かく制御したいという点が大事である場合、Google カスタム検索は不向きかもしれません。質問文章に挙げられているサイトとできるだけ似た感じに作りたい場合は、Wordpress というブログシステムを利用すれば良いかと思われます。
検索boxの設置は、思っていたよりもちょっと大変そうな印象をうけています。
もし、例であげているサイトと同じ、検索boxのデザイン(検索結果のデザインは同じでなくても。)にする場合、最良のソースやシステム策などがございましたら、教えてやってください。サイト内のページ数は多くても30ページ程度(文章も少ない)に収まる予定ですので、サーバーへの負荷はあまり気にしておりません。うーん。難しそうで、めげそうですが..アハハ
さらに追加の情報ということで。
最初から自前の全文検索システムを導入しようとしてもたぶん挫折してしまうと思うので、最初は Google カスタム検索を「とりあえず使ってみる」というのが無難だと思います。アレなら設置に失敗するということはまずないと思いますので。
検索ボックスのデザインですが、Google カスタム検索であれなんでアレ、それなりに自由にデザイン出来るはずです。大体の検索ボックスは以下のような感じになっていると思うので、適宜 CSS などを書いてやればOKです。
<form method="get(post の場合もある。指定された値にしておく)" id="※指定された値か、指定されていない場合は自分で勝手につけても良い※" action="※指定された値※"> <p> <!-- テキストボックス --> <input type="text" value="" name="※指定された値※" id="※指定された値か、指定されていない場合は自分で勝手につけても良い※" /> <!-- ボタン(画像) --> <input type="image" src="ボタンとして表示したい画像" (※id 属性や name 属性も必要であれば書いておく※) /> </p> </form>
こんな感じですね。
ありがとうございます。ボックス内のgoogleのロゴが消せるのであれば、カスタマイズして設置してみようと思います。ソースまで書いて頂き、どうもありがとうございました!心より。
ありがとうございます!googleカスタム検索が便利そうなのですが、表示されている検索ボックス内に「googleカスタム検索」と薄字で入っているのが格好わるくて(僕のサイトはデザイン系サイトなので。)、外せないのでしょうか?
(一応、googleのコントロールパネルで試してみました。)
また、外せるのであれば、ボックスのデザインをbrooklynparlor.co.jp/にあるような、オリジナルデザインに変更することは手間がかかる作業になるのでしょうか?
ちなみに、この上記のサイトはどのような、検索のやり方になっているのかお分かりでしたら、教えてやってください。
(このサイトのページ構造を参考にサイトを作っております。)