userChrome.cssとは?

ブラウザ・Mozilla Firefoxを使用していて、「userChrome.css」というファイルについて聞いたことはありませんか?userChrome.cssとは、Firefoxのレイアウトやスタイルを調整することのできる設定ファイルです。Firefoxのタブやレイアウトといった見た目を変更したり、右クリックのコンテキストメニューの編集など様々なことが行えますよ。ただし、デフォルトでは無効化されているほか編集には専門的な知識が必要となります。この記事では、userChrome.cssの使い方をご紹介していきます。
userChrome.cssの使い方
userChrome.cssを有効にする

それでは、userChrome.cssの使い方を説明していきます。まずはuserChrome.cssを有効にする必要があります。Firefoxを起動したら、アドレスバーに「about:config」と入力してEnterキーを押しましょう。

「注意して進んでください!」画面が表示されるので、「危険性を承知の上で使用する」ボタンをクリックして進みましょう。

「高度な設定」ページが開きます。ページ上部の検索ボックスに「toolkit.legacyUserProfileCustomizations.stylesheets」と入力しましょう。すると該当の項目が表示されるので、値が「true」になっているか確認します。この値が「false」になっている場合はuserChrome.cssが無効になっています。

userChrome.cssを有効にするには、値「false」をダブルクリックして「true」にしましょう。これで、userChrome.cssが有効になります。
userChrome.cssの配置場所・記述

続いて、「userChrome.css」をメモ帳アプリなどのテキストエディタで開きます。firefoxを起動してウィンドウ右上のメニューボタンをクリックしてメニューを開いたら、「ヘルプ」をクリックしましょう。

「ヘルプ」のサブメニューが表示されます。この一覧から「トラブルシューティング情報」をクリックしましょう。

「トラブルシューティング情報」画面が表示されます。「アプリケーション基本情報」項目一覧の「プロファイルフォルダー」に表示されている「フォルダーを開く」ボタンをクリックすると、エクスプローラーでプロファイルフォルダーが開きます。項目に表示されているパスを元に、エクスプローラーで開くのも可能です。
あとはプロファイルフォルダー内にある「chrome」フォルダを開いてから、userChrome.cssをメモ帳アプリなどのテキストエディタで開きましょう。もしchromeフォルダがない場合は新規作成でchromeフォルダを作成しましょう。userChrome.cssも同様にメモ帳アプリなどのテキストエディタで作成します。

userChrome.cssをテキストエディタで起動したら、あとはCSSを書き込んでいきましょう。記述が完了したら、ファイルを上書き保存します。上書き保存が完了したらFirefoxを再起動することで、userChrome.cssで変更した設定が反映されますよ。