[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順

userChrome.cssを使って、コンテキストメニューの項目を非表示にする手順を解説します。この方法はFirefoxに標準搭載されている機能のみで行えるので、拡張が使えなくなってしまったときのために覚えておいて損はありません。応用すればUIの編集も可能です。

手順1:ブラウザーツールボックスを有効にする

1. CTRL+SHIFT+Iキーを押して開発者ツールを開きます。

2. 右側にある歯車アイコンを押します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 開発者ツール オプション

3. 詳細設定の項にある「ブラウザーとアドオンのデバッガーを有効化」と「リモートデバッガーを有効化」にチェックを入れます。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 ブラウザーとアドオンのデバッガーを有効化 リモートデバッガーを有効化

手順2:ブラウザーツールボックスを開く

1. 編集したいコンテキストメニューを表示できるページを開きます。

2. 開いたページでCTRL+SHIFT+ALT+Iキーを押します。

3. ダイアログボックスが表示されるのでOKを押します。この表示を出さないようにするには、about:configからdevtools.debugger.prompt-connectionfalseに設定します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 リモートデバッグ接続要求
ブラウザーツールボックスは、起動したページでしか動作しないことに注意してください。

手順3:メニュー項目のIDを特定する

1. ブラウザーツールボックスの右側にある「正方形が4つのボタン」を押します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 ポップアップが自動的に隠れないようにします

2. 開いておいたページに戻り、編集したいコンテキストメニューを開きます。

3. ブラウザーツールボックスの左端にある「マウスポインタと長方形を組み合わせたボタン」を押します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 ページから要素を選択します

4. 再びページに戻り、非表示にしたい項目をクリックし選択状態にします。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 要素選択

5. ブラウザーツールボックスの左欄でハイライトされているコード内にある、id=""のダブルコーテーションの中身をコピーします。(ハイライト上で右クリック > コピー > CSSセレクターでも可)

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 要素のID
「←」のIDはcontext-back

手順4:userChrome.cssを作成する

1. アドレスバーにabout:supportと入力しエンターキーを押します。

2. アプリケーション基本情報の項のプロファイルフォルダーという項目にある「フォルダーを開く」ボタンを押します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 プロファイルフォルダーを開く

3. 開いたフォルダ内にchromeという名前のフォルダを作成します。

4. chromeフォルダ内にuserChrome.cssというファイルを作成します。作り方がわからない場合は、空のテキストファイルを作成し、拡張子を含む名前をuserChrome.cssに変更します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 useChrome.cssファイルの作成

5. userChrome.cssをエディタ(メモ帳でも可)で開きます。

6. #コピーしたID{display:none!important;}というコードを書いて保存します。

[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 userChrome.css 記述例
「←」を非表示にする場合
[Firefox]userChrome.cssを使ってコンテキストメニューの項目を非表示にする手順 userChrome.css 複数の要素
複数の項目を非表示にする場合はコンマで区切る

7. Firefoxを再起動すると反映されます。

スポンサードリンク
スポンサードリンク

TEST

お知らせ

about:config 主な設定まとめ

(2022/11/16)Firefox107リリースに伴い記事を更新しました。《記事を開く》

最近の投稿

シェア

スポンサードリンク