検索窓を設置しているWEBサイトは多いと思います。個人のブログなどでは「Google AdSense」のカスタム検索エンジンを使っている方も多いでしょう。
このカスタム検索エンジンを設置したら「検索ボタンが改行されてしまう」とお困り方いらっしゃいませんか?
Google AdSenceで作ったソースコードを使わない
検索ボタンが改行されて検索窓の下に落ちてしまう↓の様な状態。
これはGoogle AdSence内の「カスタム検索エンジン」で「カスタム検索エンジン」を作って、出来たソースコードをそのまま貼ってしまうとこうなります。
カスタム検索エンジンの表示を整えたい場合にはどうするかというと?
カスタム検索を使う
Google AdSenceではなく「カスタム検索」というページでソースコードを取得します。
作成したカスタム検索エンジンから選択
「カスタム検索」のページへ行くと「Google AdSense」で作成した「カスタム検索エンジン」が並んでいるはずです。そこからソースコードを取得したいものを選びます。
選択するとカスタム検索の編集へ飛びます。今回は省きますが、カスタム検索の様々な設定ができます。
一応、広告(AdSense)と関連付けられていることを確認しておきましょう。
デザインを選択
カスタム検索エンジンのデザインを編集します。一番簡単な方法は「テーマ」から好きなものを選びます。テーマを選ぶと右側に表示されているカスタム検索のプレビューも変わります。
ちなみに「レイアウト」では、検索結果の表示レイアウトを選べます。
設定が終わったらソースコードを取得
設定が完了したら、画面下の「保存してコードを取得」をクリックします。クリックするとコードが表示されるので、ここで表示されたコードをWEBサイトに貼り付けましょう。
これでカスタム検索がキレイに表示されるはずです。
カスタム検索のデザインを変えたい!でもCSSとか分かんないよ!という人でも「カスタム検索の編集」で色を変えたりできるから便利といえば便利。
AdSenseの画面に「その他の検索オプション機能」と「カスタム検索の編集」へのリンク表示があるにはあるけど、分かりづらいよね。