C-0069 Netscape 6/Mozilla のツールバーの文字を消す

NN4.x では「設定」→「表示」でツールバーの表示を「絵と文字（標準）」「絵」「文字」から選択でき、「絵」つまりアイコンのみの表示にして文字を消すとツールバーがスッキリしてよかったのですが、 N6/Mozilla ではブラウザの UI は全てテーマごとに XUL と CSS で定義されるようになったため、この設定はなくなってしまいました。表示を変えたければ自分で新しいテーマを作れ、という方向性になったわけです。

N6/Moz には幸い userChrome.css という UI の細かなカスタマイズのための機構が用意されているので、これを利用して「クラシック（Classic）」テーマでボタン下の文字を消す方法を考えてみました。

まず、以下の内容を userChrome.css に書き加えます。

/* ボタン下の文字列を消す */
#nav-bar-buttons text {
    display: none !important;
}
/* ボタンの無駄なスペースを消す */
#nav-bar-buttons button,
#nav-bar-buttons menubutton {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 3px !important;
}
/* ボタン類の左に余白 */
#nav-bar-buttons {
    margin-left: 5px;
}
/* URL バーの高さ調整 */
#nav-bar-inner {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 1px !important;
}
#urlbar-container {
    margin: 0 !important;
    padding: 0 !important;
}

これだけではツールバー右端のアイコンが大きなままですので、テーマからアイコンの画像だけ抜き出して縮小する必要があります。 N6/Moz をインストールしたフォルダの chrome フォルダに classic.jar というファイルがある（実体はただの ZIP ファイルです）ので、解凍して、 skin → classic → global と辿った中の animthrob.gif と animthrob_single.gif を取り出し、適当なグラフィックツールで縮小してください。

面倒な場合は以下のものをどうぞ。

• N6 用：/
• Mozilla 用：/

で、できた16×16の画像二つを userChrome.css と同じ位置に置き、 userChrome.css に以下の内容を書き加えれば OK です。

/* ウィンドウ右上のアイコン */
#navigator-throbber {
    list-style-image: url("アニメーションしない方の画像ファイル名") !important;
}
#navigator-throbber[busy="true"] {
    list-style-image: url("アニメーションする方の画像ファイル名") !important;
}

あとは N6/Moz を再起動すれば完了です。

PageTop

Back