Chrome拡張機能「stylish」が使えなくなった代わりに「Stylus」を使ってみた - 自動化厨のプログラミングメモブログ │ CODE:LIFE

以下の記事にもあるようにChrome拡張機能の中でも定番といっても過言ではない「Stylish」が利用不可能に。

代替品として完璧な「Stylus」を使ってみました。

forest.watch.impress.co.jp

Stylishとは

カスタマイズCSSを任意のページに反映させる拡張機能。例えば文字サイズが小さく見づらいサイトがあれば文字サイズが大きくなるようにfont-size: 120%;としたり、メインコンテンツ以外のバナーなどが多く見づらければそれを非表示にしたりなどが可能。

ようは見づらいサイトを自分専用に見やすくカスタマイズできる拡張機能である。

便利でいいやつと思いきや、閲覧履歴の無断収集をしていた

「Stylish」は、「Firefox」のユーザースタイルシートを管理するアドオン。Webページをカスタマイズして見やすくできるとして人気を博し、2017年1月、Webサイト分析サービスなどを提供するイスラエルのSimilarWeb社によって買収されていた。

　SimilarWeb社は「Stylish」の利用規約を改定し、ユーザーを特定できない“非個人情報（Non-Personal Information）”をサービス向上のため収集するとしていたが、セキュリティエンジニアのRobert Heaton氏が調査したところによると、実際には閲覧履歴のすべてを収集していたようだ。パスワードのリセットなどで用いられる認証トークンを含んだURLや、コンテンツの共有に使われるワンタイムURLも含まれるため、個人の特定はおろか、機密情報の入手も不可能ではない。

引用元: 人気のFirefox拡張機能「Stylish」がポリシー違反でブロック、すべての閲覧履歴を収集か - 窓の杜

代替品には「Stylus」がオススメ

f:id:maru0014:20180731230724j:plain

chrome.google.com

何故オススメかと言うと「Stylish」の設定ファイルをそのままインポートできるから。

しかも設定画面のレイアウトもほぼ同じ、そして動作が軽量（Stylishは履歴情報送ったりしてたから遅かったんだろうが）かつStylishみたいにエクスポートデータの文字化けも無く完全に上位互換です。

楽天市場の検索結果に順位を表示するCSS

f:id:maru0014:20180731231320p:plain

もともとStylishを使っていた方はその便利さをよくご存知かと思いますが、使ったことがない人のために例として掲載してみます。

これをStylusで適用すると楽天市場の検索結果に掲載順位を振り、同時に自店舗の商品を強調表示します。

body {
    counter-reset: result !important;
}

/*Ranking*/
.dui-item:not([data-track-score]) .description.title:before {
    content: counter(result) "位" !important;
    counter-increment: result !important;
    color: #c70000;
    font-size: 1.4em;
    font-weight: bold;
    text-decoration: none;
}

/* MyShop */
h2 a[href*="/ここにショップID/"],
.itemName a[href*="/シここにショップID/"],
.rnkRanking_itemName a[href*="/ここにショップID/"] {
    background: #ff0;
}

#rsrMainSect .rsrSResultItemTxt .step_double .pad a[href*="/ここにショップID/"] {
    background: #ff0;
}