「Stylish」

今回はよく利用するWebページの見た目を変更できるFirefoxのアドオンを紹介したい。StylishはWebページのCSSを変更したり、Firefoxの見栄えや機能を変更できる機能豊富なアドオンである。今回はこれを試してみる。

まず、Stylishをインストールする。Stylishのダウンロードページから[Firefoxへ追加]をクリックし、インストールを行う(図1)。





注意:本稿では、Firefoxのアドオンのインストールを行っていますが、ソフトウェアの利用は使用者の責任で行ってください。

図1 Stylishのページ

インストールし、再起動するとアドオンバーに Stylishのアイコンが表示される。

図2 アドオンバーに表示される「Stylish」のアイコン

ここをクリックするとメニューが表示される。ここで「新しいスタイルを書く」「このURL専用を」を選択すると、開いているサイト専用のカスタマイズを行うことができる。

図3 メニューから「新しいスタイルを書く」、

図4 「このURL専用を」を選ぶと

スクリプトを自分で書かずとも、ユーザーが公開しているメジャーサイトのスタイルなどをダウンロードして、そのまま適用することも可能であるし、それをお手本にして、スクリプトを作成することもできる。

図5 テキストボックスが開く。ここにスクリプトを書くことで

図6 特定のWebサイトを閲覧するときの表示を変えることができる

先のメニューで「スタイルの管理」を選択するとアドオンマネジャーが開き、Stylishに適用できるユーザースタイルが公開されているuserstyles.orgへのリンクが表示される。

図7 ユーザースタイルが公開されている「userstyles.org」へのリンクが表示されている

ここには様々サイトのカスタマイズが配布されている。今回はGoogleを変えるカスタマイズPerfect Dark Google」を適用してみる。インストールボタンを押すと図のように「お試し」、「インストール」などが表示される。ここではインストールを押す。

図8 「userstyles.org」

図9 Googleの表示を変えるスタイルをインストールすると

そのまま、GoogleをFirefoxで開くと、ご覧のようにGoogleの表示がスタイルの適用によってガラリと変わる。

図10 スタイリッシュが適用されて、Googleの表示が変わる

図11 検索結果にも適用されるほか、多くのGoogleのサービスにもこのスタイルが適用される

メニューの「スタイルの管理」からアドオンマネージャーを開くと、「Perfect Dark Google」が表示されているので、ここで「編集」をクリックすると、先ほどと同じようにCSSのソースコードが表示される。これを参考に、パラメータを変え、「保存」ボタンを押すことでさらにカスタマイズすることも可能だ。

図12 アドオンマネージャーを開くと、「Perfect Dark Google」が表示される

図13 編集をクリックすることでCSSを参考にし、カスタマイズすることも

見慣れているWebサイトの表示を自分の好みのものに変更すると、それなりに新鮮なものになる。Firefoxにはブラウザのユーザーインタフェースを簡単に変えることができるアドオン「Personas」もある。PersonasはギャラリーでオンマウスするだけでFirefoxのユーザーインタフェースを変えることができる仕組みだが、これと組み合わせることでより新鮮なインターネットライフを楽しむこともできるだろう。