こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

YahooやGoogleの検索をHPにいれる

教えてください。前回、プルダウンの件で質問をして、答えを頂いたのですがお礼を言うのを忘れていました。Flagstaffの名前に返信いただいた方、ありがとうございました。

YahooやGoogleの検索窓を、リンクキットのソースをコピペして貼ることは出来るのですが、Yahoo、Googleなど検索サイトの窓をそれぞれつけると場所をとってしまうので、下記のような検索を作りたいと考えております。どなたか教えていただけませんでしょうか。また参考になるサイトがあれば教えてください。

1.検索する情報をいれるテキストフィールドを1つだけにする。

2.テキストフィールどの幅に合わせてその下に「Yahoo検索」と「Google検索」のボタンを2つ同じ大きさで設置する。

3.テキストフィールドに検索文字を入力してYahooで検索するときはYahooボタン、Googleで検索するときはGoogleボタンを押して検索する。

4.1.のテキストフィールドの横幅を変更して調整できるようにする。

5.2.のボタンを設置する際にボタンの横幅を調整できるようにする。

以上、どなかたご存知のかた教えてください。よろしくお願いします。

投稿日時 - 2005-04-25 22:32:42

QNo.1352149

困ってます

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(4)

ANo.4

ここのサイトで検索窓を無料配布しています。

参考URL:http://useing.com/free/search.html

投稿日時 - 2005-05-25 09:24:07

ANo.3

>1、3
YahooとGoogleでキーワードを入れるフィールドの名前が違うので、そのままではひとつのフォームを共有できません。
ページの下部などに隠しフォームを用意して、テキストフィールドに入力された値を、それぞれのボタンが押された時に対応するフォームに送って送信します。

概要を書くので、フォームの書き方など詳しい所は調べてください。


[スクリプト部分]
KeywordField = new Array();
KeywordField['Yahoo'] = 'p'; // Yahooのキーワード入力エリア名
KeywordField['Google'] = 'q'; // Googleのキーワード入力エリア名

function {
Search (Form) {
document[Form].KeywordField[Form].value = document.dammy.keyword.value; //入力された値を該当のキーワード入力エリアに代入
document[Form].submit(); // 該当のフォームを送信
}
[ダミーフォーム]
<form name="dammy">
<input type="text" name="keyword"><br>
<input type="button" value="Yahoo検索" onclick="Search('Yahoo')">
<input type="button" value="Google検索" onclick="Search('Google')">
</form>

[隠しフォーム]
Yahoo, Googleのサイトで配布されているフォームを張り付ける。フォーム部品の属性を全てhiddenに書き換えて、見えなくしておく。
<form name="Yahoo">のように、各フォームには名前を付けておく。

ダミーフォームのテキストフィールドやボタンの横幅は、HTMLとCSSで適当に調整してください。

投稿日時 - 2005-04-26 11:29:12

ANo.2

下のようにして見て下さい。

まず2列2行の表を作ってやります。
上の行に検索窓をそれぞれ入れ、下の行にはそのボタンを入れます。
その表のサイズを調整する事でご希望のデザインになります。但しある程度寸法には制限があって、テキストフィールドの高さに合わせる必要があると思います。
ソースを貼り付けられたのですからある程度HTMLは読めますよね。

もしわからない箇所があっても挑戦して見て下さい。そのコツはHTMLを部分毎に一つ記述を変えてみてそれがどう見え方に影響を与えるかを確認する、それを繰り返すのです。一度に変えるのは一箇所だけにしないと解らなくなります。
表である事を感じさせまいとすれば、table border="0"と記述してやれば良いです。

私もそのようにして自分の好みのデザインに変えてHPに貼り付けました。
このように自分で研究すれば知識は確実なものになるので、この手は良く使っています。

投稿日時 - 2005-04-25 23:12:52

ANo.1

こんばんわぁ、Blackwinglsです。

そういえば昔
http://okweb.jp/kotaeru.php3?q=732344
という回答をしました。
参考になりますかねぇ・・・・

4と5の要望は、結構面倒な処理が必要となりそうです。
必須条件かどうか再度検討されたら如何でしょうか。

ではでは~☆彡

参考URL:http://okweb.jp/kotaeru.php3?q=732344

投稿日時 - 2005-04-25 23:11:35

お礼

ありがとうございました。参考になりました。

投稿日時 - 2005-04-26 23:33:58

あなたにオススメの質問