Firefox 144で追加されたサイドバーメニューを消す方法

Firefoxのバージョン144あたりのアップデートで、ブラウザのサイドバーの表示に変更があり、ツリー型タブ(TST)を使用しているときに、無駄な領域が発生していました。

この記事ではこの領域をuserChrome.cssを修正することで改善していきます。

userChrome.cssの有効化
修正内容
注意点
〆

userChrome.cssの有効化

恐らく多くの方はすでに行っていると思いますが、簡単に紹介しておきます。

URLに”about:config“と入力してエンター
“危険性を承知の上で使用する“をック
検索欄に”toolkit.legacyUserProfileCustomizations.stylesheets“と入力
表示された”toolkit.legacyUserProfileCustomizations.stylesheets“を”true“に変更
Firefoxを再起動

プロファイルフォルダは右上のメニューから、ヘルプ->他のトラブルシューティング情報を開いて、プロファイルフォルダーのフォルダーを開くから表示するのが楽です。

修正内容

プロファイルフォルダーのchromeフォルダ内にあるuserChrome.cssに以下の文を追記してください。ディレクトリがない場合は新規作成で問題ありません。

タブスタイルは横型で実行しているので、縦型にすると追加で余計な要素を消す必要があるかもしれません。

/* サイドバーのヘッダーを非表示にする */
#sidebar-panel-header {
  display: none !important;
}

/* サイドバーの境界線を消す */
#browser #sidebar {
  outline: none !important;
  box-shadow: none !important;
}

/* サイドバーのボタン要素を消す */
#sidebar-main {
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

設定ボタンなどを残しておきたい場合は、一番下のコードは書かないでください。

上のタブバーなどの削除を含めた現在の私のuserChrome.cssは以下のようになっています。

@import url("chrome/custom_files/custom.css");

/* デフォルトのタブバーを消す */
#TabsToolbar {
    visibility: collapse !important;
}

/* サイドバーのヘッダーを消す */
#sidebar-panel-header {
  display: none !important;
}

/* サイドバーの境界線を消す */
#browser #sidebar {
  outline: none !important;
  box-shadow: none !important;
}

/* サイドバーのボタン要素を消す */
#sidebar-main {
  width: 0 !important;
  min-width: 0 !important;
  max-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

適用すると以下の画像のように変更されます。