Firefox 検索バーに履歴表示ボタンをつける。

Firefox検索バーの履歴表示は、検索バーが空白の状態のときに。

• キーボードショートカットなら、Ctrl+kで検索バーにフォーカスを移してから↓の押下。
• マウス操作なら、検索バーの入力フィールドをクリック、↓の押下。

で検索履歴が表示されます。　これは前の記事で書きましたね。

でもマウス操作のとき、クリック後に「下カーソルキー」を押すのはちょっと不便です。　そこで検索バーの履歴ボタンを、ロケーションバーの履歴ボタンと同じデザインで追加してみました。　これでマウス操作だけでも、検索履歴の表示が出来るようにになります。

虫眼鏡アイコンの右隣のボタンが、検索履歴の表示ボタンです。ボタンのデザインを、ロケーションバーのドロップマーカーと同じにしました。

この履歴ボタンを検索バーに追加する方法は、FirefoxのuserChrome.cssファイルに、下のユーザースタイルを追加します。　このファイルは、ユーザプロファイルディレクトリ直下のchromeサブディレクトリに置きます。

WindowsXPの場合userChrome.cssの場所はここになっています。

C:\Documents and Settings\｛ユーザー名｝\Application Data\Mozilla\Firefox\Profiles｛数字の羅列｝.default\chrome

このフォルダには、サンプルファイルuserChrome-example.cssがあるので、これを元にして追加記入後に、ファイル名をuserChrome.cssに変えて保存するのが確実かもしれません。　文字コードはUTF-8で保存します。

次項の「Stylish」アドオンを使うと、もっと簡単に設定できます。

履歴ボタンを検索バーに追加するユーザースタイル

/*検索履歴ボタン*/
/* Reference from  chrome://browser/skin/browser.css  ,at  Location bar dropmarker */

#searchbar .autocomplete-history-dropmarker {
    -moz-binding: url("chrome://global/content/bindings/autocomplete.xml#history-dropmarker");
    display: -moz-box !important;   
    -moz-appearance: none !important;
    padding: 0 3px !important;
    background-color: transparent !important;
    border: none !important;
    width: auto !important;
    list-style-image: url("chrome://browser/skin/urlbar-history-dropmarker.png")!important;
    -moz-image-region: rect(0px, 11px, 14px, 0px) !important;
}

#searchbar .autocomplete-history-dropmarker:hover {
  background-image: -moz-radial-gradient(center, circle closest-side, hsla(205,100%,70%,.3), hsla(205,100%,70%,0)) !important;
  -moz-image-region: rect(0px, 22px, 14px, 11px) !important;
}

#searchbar .autocomplete-history-dropmarker:active,
#searchbar .autocomplete-history-dropmarker[open="true"] {
  background-image: -moz-radial-gradient(center, circle closest-side, hsla(205,100%,70%,.1), hsla(205,100%,70%,0)) !important;
  -moz-image-region: rect(0px, 33px, 14px, 22px) !important;
}

「Stylish」で設定する場合。

「Stylish」
https://addons.mozilla.org/ja/firefox/addon/stylish/

このアドオンはユーザースタイルを管理するアドオンで、ユーザースタイルを使うときにとても便利です。

履歴表示ボタンの設定手順。

1. アドオンをインストール後に、Firefoxの「アドオンマネージャ」を開きます。
2. 「新しいスタイルを書く」のボタンを押すと、「新しいスタイル」の編集ダイアログが表示されます。
3. 「名前」欄には設定するスタイル名を入力します。　「履歴表示ボタン」等の任意の名前でOKです。
4. 中央の編集ウインドウに、上記のコードをコピーして貼り付けます。
5. 「保存」ボタンを押して終了します。

これで履歴表示ボタンが表示されるようになります。