2012/02/24

新Google Bar対応!Google ReaderをMac風にする『Mac OS Lion UI Fixed』

2012/02/24 Google Readerの上部に表示されるGoogleバーが新しくなり、以前から利用させて頂いてた『Google Reader — Mac OS Lion UI』で表示するとレイアウトが崩れるようになりました。

標準Viewで見る分には問題ないのですが、慣れてしまうとどうしても見づらく感じるため、修正したものを作成しましたので紹介致します。


以前、紹介した記事がこちら

Googleリーダーを通常の3倍のスピードで利用する便利な使い方まとめ 共有 - 全文表示 - iPhone連携


この記事の『GoogleリーダーのUIを変更し見やすくする』の部分で導入方法を説明していますが、そのままですと下のようなレイアウトが崩れた表示になっているかと思います。



それを以下のような表示にする拡張を作ってみました。




Google Reader — Mac OS Lion UI FixedのInstall



対応ブラウザは、FireFox、Google Chromeになります。

Step 1:『Stylish』の拡張機能をInstall


Step 2Google Reader — Mac OS Lion UI Fixed - userstyles.org

こちらからUserStyleをInstallして適用されます。


このように見やすくなったかと思います。

手直しした部分は、以下のCSSをMac OS Lion UIに追加してあります。
/* Googleロゴを消す */
#gbql{
    display: none!important;
}

/* 上部の領域を広げる */
#gbx3 {
    background-color: #F1F1F1!important;
    height: 52px!important;
    border-bottom: 1px solid #CCCCCC !important;
}

/* 上部を広げたことにより隠れたmain部分を下げる */
#main{
    margin-top: 16px!important;
}

/* 検索BOX,Google+エリアの移動 */
#gbq, #gbu {
    top: 18px!important;
    z-index: 997!important;
}

/* Google+共有位置をtopへ移動 */
div#gbwc{top:0!important;}

/*  JP AD BLOCK */
img[src^="http://bnr.rssad.jp/"],
a[href^="http://rss.rssad.jp/"],
a[href^="http://www.rssad.jp/"],
span#viewer-translated-by,
iframe[src^="http://translate.google.com/translate"]{display:none !important;}
すでに『Google Reader — Mac OS Lion UI』を適用されている方は、そちらを無効にしても同様の表示になります。また、自分好みにしたい場合は『Stylish』アドオン(拡張機能)の管理から編集できます。

Installしてみて何か問題がありましたら、コメントやTwitterなどで教えて頂ければ幸いです。


追記:Google翻訳使用時のiframeによる広告を非表示にしました。

[表示させたい場合]
,
iframe[src^="http://translate.google.com/translate"]
この部分を削除して下さい。