Syoichi's Tumblr

Firefox 4が良い感じ。

Chromeに移行してからFirefoxのカスタマイズ周りの情報をあまり追ってなかったけど、何とかChromeっぽくカスタマイズできた。まだ工夫すればもう少し削れてIE9みたいにできるかも。

今のところインストールしてある拡張は、AutoPagerize 0.7.2、DOM Inspector 2.0.9、Firebug 1.7.0、FireGestures 1.6.1、Scriptish 0.1、Tombloo 0.4.21の6つ。GreasemonkeyではなくScriptishを入れたのは、Greasemonkeyではアドオンバーからナビゲーションツールバーにアイコンを移動させる事が自分の力ではできなかった為(ロケーションバーをアドオンバーに移動させる事もできるけど下にあるのはやはり慣れない)。代わりにScriptishを入れた事でアドオンバーを非表示にしても不都合がなくなった。

User Scriptは特に特筆すべきものは入れてないけど、このスタイルを実現する為の方法とuserChrome.cssの設定についてはメモしておく。

まず、拡張をインストールして再起動させた後、「戻る」、「進む」などの必要な機能はFireGesturesによるマウスジェスチャで実現できるようにしておき、メニューの「表示」の「ツールバー」にある「カスタマイズ」から可能な限りアイコンを追加、移動、非表示にする。ツールバーはナビゲーションツールバーのみを表示し、「タブを上部に表示」を有効のままにしておく。また、フィードアイコンはロケーションバーの隣に置いておく。さらに、Tomblooの設定で「コンテキストメニューの最上部に表示する」を有効にする。

次に、「%APPDATA%/Mozilla/Firefox/Profiles/(英数字の羅列).(プロファイル名)/」(Windows XPの場合)に「chrome」フォルダを作成し、その中に「userChrome.css」ファイルを作成する。そして、以下のUser CSSを書き込む。

@charset "utf-8";
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);


/* FirefoxボタンをFirefoxアイコンに置き換える(from https://gist.github.com/586620) */
#main-window[chromemargin]:not([inFullscreen="true"]) #navigator-toolbox:not([customizing="true"]) {
  margin-top: -24px !important;
}

#main-window[chromemargin] #appmenu-button{
  background: transparent no-repeat center center url("moz-icon://file:///C:/Program Files/Mozilla Firefox/firefox.exe?size=16") !important;
  border: none !important;
  min-width: 20px !important;
  max-width: 20px !important;
  max-height: 20px !important;
  margin: 4px 0 0 4px !important;
  box-shadow: none !important;
}

#main-window[chromemargin]:not([inFullscreen="true"]) #appmenu-button .button-text,
#main-window[chromemargin]:not([inFullscreen="true"]) #appmenu-button .button-menu-dropmarker {
  display: none !important;
}

#main-window[chromemargin]:not([inFullscreen="true"]) #appmenu-button-container,
#main-window[chromemargin]:not([inFullscreen="true"]) #titlebar-buttonbox,
#main-window[chromemargin]:not([inFullscreen="true"]) #toolbar-menubar > * {
  position: relative !important;
  z-index: 10 !important;
}
/* end */


/* 「タブを閉じる」ボタンを非表示 */
.tab-close-button {
  display: none !important;
}
/* end */


/* Firefox 4 - Feeds Icon in location bar(from http://userstyles.org/styles/38569) */
/* Remove button shape and place in the location bar */
#urlbar-container + #feed-button,
#urlbar-container + #reload-button + #stop-button + #feed-button {
  -moz-appearance: none !important;
  border: 0 !important;
  background: white !important;
  box-shadow: white -10px 0 7px -2px !important;
  padding: 0 0 0 0px !important;
  margin: 4px 42px 4px -60px !important;
  position: fixed !important;
  z-index: 1 !important;
}
#urlbar-container + #reload-button + #stop-button + #feed-button {
  margin: 4px 64px 4px -82px !important;
}

/* Hover effect */
#urlbar-container + #feed-button:not(:hover) > image,
#urlbar-container + #reload-button + #stop-button + #feed-button:not(:hover) > image {
  opacity: 0.5;
}
#urlbar-container + #feed-button:not([disabled="true"]):not(:active):hover > image,
#urlbar-container + #reload-button + #stop-button + #feed-button:not([disabled="true"]):not(:active):hover > image {
  -moz-transition: opacity .3s ease-in;
}

/* Hide when no feeds */
#urlbar-container + #feed-button[disabled="true"],
#urlbar-container + #reload-button + #stop-button + #feed-button[disabled="true"] {
  display: none !important;
}

/* Hide when showing link preview */
#urlbar {
  position: relative !important;
  z-index: 0 !important;
}
#urlbar[overlinkstate]:not([overlinkstate="fade-out"]) {
  z-index: 2 !important;
}
/* end */


/* コンテキストメニューを整理する */
#context-back, /* 戻る */
#context-forward, /* 進む */
#context-reload, /* 更新 */
#context-stop, /* 中止 */
#context-sep-stop, /* 「中止」の真下にあるセパレーター */
#context-bookmarkpage, /* このページをブックマーク */
#context-savepage, /* 名前を付けてページを保存... */
#context-sendpage, /* ページの URL をメールで送信... */
#context-openlink, /* リンクを新しいウィンドウで開く */
#context-openlinkintab, /* リンクを新しいタブで開く */
#context-sep-open, /* 「リンクを新しいタブで開く」の真下のセパレーター */
#context-bookmarklink, /* このリンクをブックマーク */
#context-sendlink, /* リンクの URL をメールで送信... */
#context-sendvideo, /* 動画の URL をメールで送信... */
#context-sendaudio, /* オーディオの URL をメールで送信... */
#context-sendimage, /* 画像の URL をメールで送信... */
#context-setDesktopBackground, /* デスクトップの背景に設定... */
#context-sep-viewbgimage, /* 「背景画像だけを表示」の真上のセパレーター */
#context-viewbgimage[disabled="true"], /* 「背景画像だけを表示」が無効の時 */
#context-selectall, /* すべて選択 */
#context-searchselect, /* ***で 検索： "～" */
#context-viewpartialsource-selection, /* 選択した部分のソースを表示 */
#context-keywordfield, /* この検索にキーワードを設定... */
#spell-separator, /* 「スペルチェックを行う」の真上のセパレーター */
#spell-check-enabled, /* スペルチェックを行う */
#context-printpage, /* 印刷... */
#frame-sep, /* 「このフレーム」の真上のセパレーター */
#context-openframe, /* フレームを新しいウィンドウで開く */
#context-printframe, /* フレームを印刷... */
#context-printframe + menuseparator, /* 「フレームを印刷...」の真下のセパレーター */
#context-viewframesource, /* フレームのソースを表示 */
#context-viewbgimage[disabled="true"] ~ #context-sep-viewsource, /* 「背景画像だけを表示」が無効の時の「ページのソースを表示」の真上のセパレーター */
#context-viewsource, /* ページのソースを表示 */
#context-viewinfo, /* ページの情報を表示 */
#tombloo-menu-share, /* Tomblooの「Share - ***」 */
#frame[hidden="true"] ~ #context-bidi-page-direction-toggle + menuseparator /* 「このフレーム」が非表示の時のFirebugの「要素を調査」の真上のセパレーター */ {
  display: none !important;
}
/* end */

以上はここや、ここを参考にした。Firefoxボタンの置き換えは画面を最大化していない時だと表示がおかしくなるけど、挙動自体は今のところ問題ないみたい。ロケーションバーにフィードアイコンを表示させるスタイルは拡張もあるようだけど、User CSSのみで実現できるようだ。また、ここを参考にDOM Inspectorで調査してコンテキストメニューを整理した。これで、StylishやMenu EditorなしにuserChrome.cssで自分好みのスタイルに変更する事ができた。サイト毎に適用するUser CSSはuserContent.cssに書き込めば反映されるけどこちらはまだ弄ってない。userstyles.orgにある頻繁に更新されるUser CSSを利用する場合はStylishの方が一括して更新ができて便利だし再起動無しにすぐに反映されるけど、それほど使わない分にはこれで問題ないかな。後弄るとしたらタブ幅かなぁ。ページタイトルが短い時にタブ幅をそれに合わせて短くするのって、Tab Mix Plus無しでどうやるんだろ。

FireGesturesのマッピングも公開したかったけど、簡単にはできなさそうだったので残念。

今回Firefox 4を使っていく中で感じた不満な点は、6つしか拡張をインストールしていないのにタブを幾つか開いたり閉じたりを繰り返して放置しておくと、20ほど(User Scriptを除いた数字)の拡張がインストールされながら軽快に動作するChrome並にメモリーが増えてしまって動作が重たくなってくる事(まぁChromeでもタブを開きすぎて何度もブルースクリーンが表示された事があるからなぁ…)と、Panorama(タブグループ)や「アドオン入手」の画面が重すぎた事くらいで、使用感はとても良かった。最新のPCだと軽快に動作するのかな。

まぁでも自分はまだまだカスタマイズを全然してない方なので、Firefoxに依存していない今はChromeで十分かな。相変わらずカスタマイズするのは楽しいけど。でも、Firefoxでなければできない事や、自分にとってChromeよりも魅力に感じる点がもっと増えればまた常用する事になるだろう。とりあえず、今は優秀なタブブラウザとして使っていこうと思う。