Top Stylish >Googleの各サイト上部に表示される[Google Bar]をカスタマイズすることができるユーザースタイルあれこれ。
2012年09月21日

Googleの各サイト上部に表示される[Google Bar]をカスタマイズすることができるユーザースタイルあれこれ。

Google ウェブ検索をはじめGoogleの各サービスへアクセスすると、そのページ上部には他のサービスへ移動することができる黒い[Google Bar]が表示されます。

このバーを使えば、同一キーワードで画像や動画検索を素早く実行することができて便利ですが、どうもこのバーのスタイルがイマイチ気に入らないという方も多いのではないでしょうか。

たとえばウェブ検索ページに背景画像を適用しているような場合、下部のメニューバーは透明化されるのにこのバーは相変わらず黒いままで、スタイルがマッチしないという不満を持っている方もいらっしゃるでしょう。

そこで今回は、このGoogle Barを好みのスタイルに変更することができるユーザースタイルをいくつかご紹介したいと思います。

*下記は全てStylish用ユーザースタイルとして公開されているもので、Stylishユーザー向けの説明となります。

*各CSSはgoogle.comおよびその他各国のドメイン向けになっていますので、ユーザースタイル保存時に@-moz-document domain('google.com')などの記述部分を[google.co.jp]に書き換えることで日本語版に対応できます。

また、複数に対応させたい場合は@-moz-document domain('google.com'), domain('google.co.jp')などという具合に複数のドメインを追記してください。



1.Google bar-Change Color

その名の通り、Google Barの背景色、文字色を変更することができます。


01_Google bar-Change Color stylish+1.jpg


インストール時に11色の背景色、白/黒のテキストカラーを選択できるほか、CSS内の[background-color]および[border-color]のカラーコードを書き換えることで好みの配色にすることができます。


2.Narrow Google Bar

Google Barの高さを調整してスリム化できます。


01_Narrow Google Bar Stylish+1.jpg


インストール→保存時に[height][top]の数値を変更することで任意の高さや位置にすることもできます。


3.Transparent Google-Bar


01_Transparent Google-Bar Stylish+1.jpg


Google Barを透明化します。背景に画像を使っているような場合におすすめ。


4.Lighten up the Google Bar


01_Lighten up the Google Bar Stylish.JPG


Google Barの背景色をシンプルなライトグレーに変更できます。また、マウスポイント時のカラーが赤系になります。


5.Google Apps - Hide Google Bar

GmailやGoogle カレンダー、Google リーダーなどのウェブアプリではGoogle Barを表示しないようにできます。


6.Google Bar Colorizer mod


01_Google Bar Colorizer mod Stylish+1.jpg


バーの色、およびマウスオーバー時の色を変更できます。

インストール時にカラーコードで両者を指定することができるほか、CSSの直接編集で好みの色にすることができます。


以上のようなCSSを適用することで、便利なGoogle Barを自分だけのスタイルに変更することができます。

あの黒いバーが気に入らないという方は、これらをうまく使ってクールなバーに仕上げてみてはいかがでしょうか。

なお、Google Chromeをご利用なら、「Big G Black Bar Sorter」というアドオンをインストールすることで、このバーにあるアイテムをドラッグ&ドロップで移動させ、好きな配置にすることもできますので、興味のある方はこちらもお試しください。


02_Big G Black Bar Sorter Google Chrome extension+1.jpg


<関連記事>


■新しくなったGoogle リーダーのUIをカスタマイズできるユーザースタイルあれこれ。

■GoogleのUIをカスタマイズする55種のスクリプトやスタイルを詰め込んだFirefoxアドオン「SearchTweaker」

■Googleを激しくカスタマイズできるGreasemonkeyスクリプト「Google Fx」

posted by moziller at 19:50 | Comment(0) | TrackBack(0) | Stylish



この記事をはてなブックマークに登録 follow us in feedly このエントリを del.icio.us に登録 この記事をクリップ!Yahoo!ブックマークに登録
この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバック





×

この広告は180日以上新しい記事の投稿がないブログに表示されております。