【多段タブ】Firefox 108
Firefoxがバージョン108アップデート後に多段タブが動作しなくなりましたので更新しました。
Firefox108、110.0a1、109.0b2（Nightly、Beta、Dev）で動作確認しています。
以前のバージョンを使用する場合は各記事をご参照ください。
元記事はこちら。
Firefox 101
Firefox 81
Firefox 76
Firefox 74
Firefox 72
Firefoxを使いやすくカスタマイズする （about:config の設定方法はこちら）
Firefox69以降を新規インストールした場合は about:config を開き、 を true に変更します。
を true に変更します。
設定方法
配布元
当サイトで紹介しているものはGitHubで配布されているものを元にして、多段タブ部分のみ使用しています。
使用方法がわかる方はこちらから直接ダウンロードしてご利用ください。
https://github.com/Izheil/Quantum-Nox-Firefox-Dark-Full-Them...ファイルのダウンロード
解凍すると以下の[フォルダー]、ファイルが入っています。
[root] ―┬― [defaults] ─ [pref] ─ config-prefs.js
└― config.js
[utils] ― chrome.manifest、userChrome.jsm、xPref.jsm
MultiRowTabLiteforFx.uc.js(※)
MultiRowTab-scrollable.uc.js(※)
MultiRowTab-scrollable-autohide.uc.js(※)
userChrome.css 下線を引いたファイル（3つ＋※印ひとつ）、フォルダー（１つ）を以下の通りコピーまたは移動してください。
MultiRowTabLiteforFx.uc.js．．．タブの段数は無制限
MultiRowTab-scrollable.uc.js．．．タブ段が3段以上になるとスクロール
MultiRowTab-scrollable-autohide.uc.js．．．タブ段が3段以上になるとスクロール（スクロールバーはタブ上にポインターを乗せると表示）
（タブの段数はファイルを編集すると変更できます）
「utils」 フォルダー内の 「boot.jsm」 が削除になっています。
Firefoxがインストールされているフォルダー
firefox.exe があるディレクトリーを開く
Firefoxがインストールされているフォルダー：
64bits Firefox:32bits Firefox:
Firefoxフォルダーにファイルを入れる
(a) [Mozilla Firefox]フォルダー直下（「firefox.exe」があるディレクトリー）にconfig.jsを入れる
(b) [defaults] ━ [pref] フォルダーにconfig-prefs.jsを入れる
[Mozilla Firefox] ―┬― [defaults] ─ [pref] ─ config-prefs.js
├― config.js
├― firefox.exe
└― other files...
config.js の名前を _config.js 等に変更し、ダウンロードした config.js を入れます。
私の環境では、Firefoxを再起動後に _config.js の内容が新しい config.js に追記されていましたが、同じ結果になるかは不明です。追記されているか一応確認しておく方がいいかもしれません。
Chromeフォルダー
プロファイルフォルダーを開く
Firefoxのプロファイルフォルダー内の「Chrome」フォルダーを開きます。
過去にuserChrome.css等の利用をしていない場合は「Chrome」という名前のフォルダーを作成します。
以下のパスをコピーしマイコンピューターのアドレス欄にそのまま貼り付けてEnterキーを押せばプロファイルフォルダーが開きますので、その中にある個別のプロファイルフォルダー（xxxxxxx.profile名）の中から使うものを開きます。
プロファイルフォルダーが複数あってわからない場合は、使用するFirefoxを起動し、URL欄に about:profiles と入力しEnterキーを押すと「プロファイルについて」が開きます。
「これは使用中のプロファイルです」と表示されているところを探し、「ルートディレクトリー」の行で「フォルダーを開く」ボタンを押せばフォルダーが開きます。
Chromeフォルダーにファイルを入れる
下の3つをChromeフォルダーに入れます。
[utils] ← フォルダーのまま入れてください
MultiRowTab*****.uc.js ← 3つのうちのひとつ（複数を入れないでください）
userChrome.css
[chrome] ―┬― [utils] ―┬― chrome.manifest
│ ├― userChrome.jsm
│ └― xPref.jsm
├― MultiRowTab*****.uc.js
└― userChrome.css
.jsと.css ファイルは当方で使用しているものがそのまま入っていますので、変更したくない部分などは適宜修正してください。
（変更点は次の項で）
全部のフォルダーやファイルを入れ終わったらFirefoxを再起動すると多段タブになっていると思います。
オリジナルから変更したところ
MultiRowTab*****.uc.js
オリジナル
:root {
--tab-growth: 1}
.tabbrowser-tab:not([pinned]) {
flex-grow: var(--tab-growth)}改変版
タブの段数、幅、幅の調整、高さ、フォント等の変更はこのファイルを編集してください。
段数はスクロール版のみです。
/* タブの段数、幅 */
:root {
--max-tab-rows: 3; /* 段数 */
--min-tab-width: 130px; /* 最小幅 */
--max-tab-width: 150px; /* 最大幅 */
--tab-growth: 1}
/* タブ幅の調整 */
.tabbrowser-tab[fadein]:not([pinned]) {
flex-grow: var(--tab-growth);
min-width: var(--min-tab-width) !important;
max-width: var(--max-tab-width) !important}
/* タブの外観 */
:root {
--tab-toolbar-navbar-overlap: 0px !important;}
#TabsToolbar {
margin-bottom: 0px !important;
font-family : "メイリオ"; /* フォント */
font-weight: 400; /* フォントの太さ */
font-size: 12px} /* フォントサイズ */
タブの高さ調整
今回から MultiRowTab*****.uc.js に記載してある方法に変更しています。
MultiRowTab*.uc.js の 98 行目以降（スクロール版は 122 or 126 行目）に以下のような記述がありますので、例のように高さを指定してください。
（最小値は20px、デフォルトは「inherit」を指定）
#TabsToolbar {
--tab-min-height: 24px !important;
}
userChrome.cssに
以下を追記しています。（今回は下の3つを追加・変更）
・閉じるボタンをタブに表示
・検索バーを上に移動
・検索バーの閉じるボタンを表示
・検索バーのフォント等を変更
・アクティブタブの色を変更
・音の出ているタブの色を変更
[PR] パソコン操作をもっと速く楽にするため小ネタ満載
￥500（Kindle Unlimitedは無料）
