きゃらりこ日誌

2018年03月

Firefox 57 Quantumで使ってるアドオン・userChrome.css・user.js晒し

PC・家電
Firefox3.5の頃(2009年9月25日の記事)にも同じような内容の記事を書いていたのですが、Firefox 57 Quantumでの大規模アップデートにより大半が使えなくなってしまったので、現在使っているアドオン・userChrome.css・user.jsを公開します。

ちなみに、
  • 標準機能をできるだけ生かす
  • ノーメンテナンスで長く使える
  • 他のブラウザに移行する羽目になった際に戸惑わないように、使い勝手に大きく影響を及ぼすカスタマイズは行わない
という方針でカスタマイズしています。
なおuserChrome.css・user.jsの置き場所は、次の方法で調べることができます。
about:profiles と入力すると、「プロファイルについて」というページが表示されるので、「ルートディレクトリー」の「このフォルダを開く」を押してください。
user.jsは、このフォルダの中に置きます。
なおuserChrome.cssは、その中のchromeフォルダ内にあります。

※2020-09-26追記
Firefox 68以降では起動時の高速化策として、about:configで、toolkit.legacyUserProfileCustomizations.stylesheetsの値がtrueになってないと、userChrome.cssを読み込んでくれなくなりました。
about:configで設定するか、user.jsにuser_pref("toolkit.legacyUserProfileCustomizations.stylesheets", true);を追加してください。

テーマ
Light
デフォルトでインストールされているテーマの1つです。デフォルトのテーマは黒いので、明るいものを選びました。
ついでにブラウザ最上部の「ページ名 - Mozilla Firefox」の部分を消すため、[≡]→[カスタマイズ]で、左下にある「タイトルバー」のチェックを外しています。

アドオン
Format Link
URL・サイト名をコピーしてくれるアドオン。設定でカスタマイズすると、HTMLタグやMarkdown・Wiki記法など、任意の記法にすることができる。
Tab Session Manager
タブ・ウィンドウのセッション管理機能を拡張するアドオン。クラッシュ・誤ってブラウザを終了したときに、簡単に復旧できるように導入。
User Agent Switcher
ユーザエージェントを切り替えるアドオン。まれに、特定のブラウザ・バージョンでないと見られないサイトがあるので、その対策として使用。
Video DownloadHelper
Youtubeなどの動画をダウンロードするためのアドオン。移動中にスマホで視聴すると通信速度が遅い&パケット代がかかるので、このアドオンを使って事前に見たい動画をダウンロードしておく。
Web Developer
ウェブサイト制作に必要な機能を盛り込んだアドオン。

userChrome.css
説明は、コメントを参照。

※2019-02-07追記
 「選択中のタブの上部に、赤色の線をつける」は、同様のものがFirefox 64で実装されたため、現在は不要です。また「選択中のタブを太字にする」は無効になっています。
 「タブをツールバーの下に移動させる」は、Firefox 65でタブバー周りの構造が変わってしまったため、下の方法が無効になりました。後述ものを使用してください。
@charset "utf-8";

/* ====== URLバー ====== */
/* 「…」(ページ操作)「☆」を非表示に */
.urlbar-page-action { display: none !important; }

/* ====== タブバー ====== */
/* タブをツールバーの下に移動させる */
/* タイトルバー等の位置を0番目(先頭)に */
#print-preview-toolbar, #printedit-toolbar, #titlebar { -moz-box-ordinal-group: 0 !important; }
/* メニューバーの位置を1番目に */
#navigator-toolbox #toolbar-menubar { -moz-box-ordinal-group: 1 !important;}
/* ナビゲーションバーの位置を2番目に */
#navigator-toolbox #nav-bar { -moz-box-ordinal-group: 2 !important; }
/* ブックマークバーの位置を3番目に */
#navigator-toolbox #PersonalToolbar { -moz-box-ordinal-group: 3 !important; }
/* サードパーティバーの位置をその次に */
#navigator-toolbox toolbar { -moz-box-ordinal-group: 10 !important; }
/* タブバーの位置を最後に */
#navigator-toolbox #TabsToolbar { -moz-box-ordinal-group: 100 !important; }

/* ***以下は、Tab Mix Lite CE風の設定 *** */
/* 選択中のタブの上部に、赤色の線をつける */
.tab-line[selected=true] { background-color: red !important; }

/* 選択中のタブを太字にする */
tab[selected="true"] { font-weight: bold !important; }

/* 選択中のタブの背景色を変える */
.tab-background[selected=true] { background-color: white !important; background-image: none !important; }

/* タブでマウスオーバーすると閉じるボタンを表示する */
.tabbrowser-tab:not(:hover) .tab-close-button{ display:none; }
.tabbrowser-tab:not([pinned]):hover .tab-close-button{ display:block !important; }

/* ====== コンテキストメニュー ====== */
/* 「←」「→」「リロード」「中止」「☆」、
「ページを Pocket に保存」、
「このリンクをブックマーク」、
「画像の URL をメールで送信...」「動画の URL をメールで送信...」「音声の URL をメールで送信...」「デスクトップの背景に設定...」、
「区切り線」「ページを端末へ送信」、
「区切り線」「背景画像だけを表示」 、
「区切り線」「ページを端末へ送信」、
「区切り線」「背景画像だけを表示」 を削除*/
#context-back, #context-forward, #context-reload, #context-stop, #context-bookmarkpage, #context-sep-navigation,
#context-video-saveimage, #context-sendimage, #context-sendvideo, #context-sendaudio, #context-setDesktopBackground,
#context-pocket,
#context-sep-sendpagetodevice, #context-sendpagetodevice,
#context-sep-viewbgimage, #context-savepage,
#context-viewbgimage,
#context-sep-sendpagetodevice, #context-sendpagetodevice,
#context-sep-viewbgimage, #context-viewbgimage
{ display: none !important; }

※2019-02-07追記
 Firefox 65対応版
 ※ https://support.mozilla.org/en/questions/1241659 を基に、私の環境にあうように数値を変更しています。高さや位置がズレる場合は、数値を調整してください。
/* ====== タブバー ====== */
/* タブをツールバーの下に移動させる */
#navigator-toolbox { height: 95px !important; }
#TabsToolbar { padding-top: 50px !important; }
#toolbar-menubar[autohide="false"] ~ #TabsToolbar { padding-top: 31px !important; }
#nav-bar { box-shadow: none !important; margin-top: -62px !important; }

※FirefoxのUIのIDを特定する方法
詳細はブラウザーツールボックス - 開発ツール | MDNを参照。
 1. 開発者ツールを起動(CTRL+SHIFT+I、または[ツール]→[ウェブ開発]→[開発ツールを表示(T)])し、歯車アイコンをクリック。
 2. 「ブラウザーとアドオンのデバッガーを有効化」と「リモートデバッガーを有効化」を有効にチェックを入れる。
 3 .ブラウザーツールボックスを開き(CTRL+SHIFT+ALT+I、または[ツール]→[ウェブ開発]→[ブラウザーツールボックス(E)])、「リモートデバッグ接続要求」のダイアログが出たらOKを押す。
 4. ブラウザーツールボックス右上の、正方形4つのアイコンをクリックし、コンテキストメニューを表示させる。
 5. ブラウザーツールボックス左上の、正方形とマウスポイントのアイコンをクリックし、該当するコンテキストメニューをクリック。
 6. UIのソースが表示されるので、IDを探す。


user.js
about:configで個々に設定することもできますが、プロファイルを作り直したり、何かのきっかけで再設定するハメになったときに面倒くさいので、user.jsでまとめて設定しています。
何が設定できるかは About:config entries - MozillaZine Knowledge Base に書いてありますが、ここに載っていないのに有効な設定項目もあります。


詳しい説明は、コメントを参照。
// ====== 全般 ======
// mailto:クリックでメーラーを起動しない
user_pref("network.protocol-handler.external.mailto", false);

// コンテキストメニューの表示禁止(いわゆる右クリック禁止)を無効化
user_pref("dom.event.contextmenu.enabled", false);

// ソースを任意のエディタで開く
user_pref("view_source.editor.external", true);
user_pref("view_source.editor.path", "C:\Program Files\〜"); // エディタのフルパスを入れる

// スペルチェックを無効化
user_pref("layout.spellcheckDefault", 0);

// ブラウザ終了時、前回のセッションを保存
user_pref("browser.showQuitWarning", true);

// セッションの保存間隔(単位はミリ秒 デフォルトは15秒)
user_pref("browser.sessionstore.interval", 60000); // 60秒

// IP v6用のDNS解決を無効化(環境によっては、初回接続が遅くなるかも)
user_pref("network.dns.disableIPv6", true);

// ページ表示履歴の最大保持日数
user_pref("browser.history_expire_days", 30); // 30日

// ページ表示履歴の最小保持日数
user_pref("browser.history_expire_days_min", 30); // 30日

// リーダービュー(Safariのリーダー機能と同等の機能)を無効化
user_pref("reader.parse-on-load.enabled", false);

// プッシュ通知(WebPush)を無効化
user_pref("dom.webnotifications.enabled", false);
user_pref("dom.push.enabled", false);

// Pocketを無効化
user_pref("browser.pocket.enabled", false);

// ====== アドオンTab mix Lite CEと同等の設定 ======
// ### リンク ###
// 新しいウィンドウではなく、新しいタブで開く
user_pref("browser.link.open_newwindow", 3);

// Java Scriptのポップアップを、上の設定と同様に開く
user_pref("browser.link.open_newwindow.restriction", 2);

// 外部から読み込まれたリンクを、新しいタブで開く
user_pref("browser.link.open_external",3); // デフォルト設定

// ### 新しいタブで開く ###
// ブックマークを開くとき、新しいタブで開く
user_pref("browser.tabs.loadBookmarksInTabs", true);

// ブックマークを開くとき、新しいタブでバックグラウンドで開く
user_pref("browser.tabs.loadBookmarksInBackground", false); // 開かない

// 新規タブは一番右端で開く
user_pref("browser.tabs.insertRelatedAfterCurrent", false); // 左で開く

// 検索バーで検索時、新しいタブで開く
user_pref("browser.search.openintab", true);

// 履歴から開く場合も新しいタブで開きたいのだが、Firefox Quantumでは設定項目から削除されてしまったので、どうしようもない…

// *** イベント ***
// ### タブを閉じる ###
// 最後のタブを閉じても、ウィンドウを閉じない
user_pref("browser.tabs.closeWindowWithLastTab", false); // 閉じたら終了

// タブを閉じたとき、直前にフォーカスしていたタブを選択
user_pref("browser.tabs.selectOwnerOnClose", true);

// ### タブを開く ###
// 新しいタブを現在のタブの隣に開く
user_pref("browser.tabs.insertRelatedAfterCurrent", false); // 最後のタブの右隣に

// *** 表示 ***
// ### タブ ###
// タブ幅 最大値
user_pref("browser.tabs.tabMaxWidth", 250); // 250px

// タブ幅 最小値
user_pref("browser.tabs.tabMinWidth", 100); // 100px

//タブ追加・削除時のアニメーションを非表示にする
user_pref("browser.tabs.animate", false);

//画面のズームの最大値(デフォルトは300%《3倍》)
user_pref("zoom.maxPercent", 500); // 500%《5倍》

// *** マウス ***
// ### タブの復元 ###
// キャッシュするタブの数
user_pref("browser.sessionstore.max_tabs_undo", 32); // 32個に

[ | この記事のURL ]