アドオン「Stylish」がブロックされたので「Custom Style Script」に乗り換える

当サイトの記事には広告が含まれます。

CustomStyleScript 01

カスタムスタイルシートの定番アドオン「Stylish」が、ユーザーのWebページ閲覧情報の全てを収集していたことが明らかになり、セキュリティまたは安定性の問題を引き起こすとして、Mozillaによってブロックされました。

「Stylish」は、カスタムCSSをURL別に適用できるアドオンです。
例えば、このサイトのサムネイル画像をちょっと大きく表示させたいという時に、自分でカスタムCSSを設定することでそういう表示にすることができます。

Greasemonkeyと共に、カスタム系のアドオンとして定番とされていました。
Firefoxの他にも、Google Chromeの拡張機能としても提供されていて利用者も多くいます。

「Stylish」の代替のアドオンとしては「Custom Style Script」というものがあり、こちらのほうが優れているので、この機会に乗り換えた方がいいでしょう。

Custom Style Script」はマルチプラットフォームで提供されていて、Firefox、Chrome、Opera向けがあります。

CSSとJavaScriptを設定できるので、GreasemonkeyとStylishを1つにまとめるのにも良いかもしれません。

設定方法は、カスタムCSSを適用したいURLを入力して、JavaScriptまたはCSSのコードを入力して+ボタンをクリックします。これで追加されて有効化されます。

CustomStyleScript 02

https://feedly.com/

/* Feedly*/
.condensed .inlineFrame {
margin: 0px !important;
padding-left: 40px !important;
padding-right: 30px !important;
}

.entryBody {
max-width: 100% !important;
font-size: 17px !important;
}

#box, #feedlyPage, #feedlyPart {
width: 99.7% !important;
}

#feedlyFrame {
margin-left: 228px !important;
}

#mainBar {
margin-left: 0px !important;
margin-left: 0px !important;
width: 100% !important;
}

h2 {
margin-top: 0px !important;
}

.entryBody h3 {
font-size: 20px !important;
}

.condensed .entryholder .u100Entry {
max-width: 100% !important;
}

.pin , [style].popup {
display: block !important;
opacity: 0 !important;
visibility: hidden;
-webkit-user-select: none !important;
}

div#feedlyPart0.aera {
padding: 23px !important;
}

div#section0.section {
height: 10px !important;
/*display:none !important;*/;
}

#feedlyMessageBar {
display: none !important;
}

#feedlyPageHeader {
margin-left: 20px !important;
}

#feedlyPart {
padding-right: 8px !important;
}

#floatingBar {
margin-left: 228px !important;
padding-top: 8px !important;
width: 88.2% !important;
}

.u4Entry {
max-width: 97% !important;
}

div.u100Entry {
max-width:100% !important;
}

#floatingTitleBar {
padding-left: 8px !important;
}

.condensed .entryholder .u100entry {
margin-left: 0px !important;
}

div.button.primary.small {
background-color: rgba(255, 102, 0, 0) !important;
}

.sliderWidth {
width: 80% !important;
}

.button.primary {
color: #F0F0F0 !important;
}
/* image size */
.inlineFrame .entryBody img {
border: 0px;
max-width: 90% !important;
width: auto !important;
height: auto !important;
max-height: 800px !important;
}
img.pinable {
width:100% !important;
margin: auto !important;
max-height: 100% !important;
margin-top: 0rem !important;
margin-bottom: 0rem !important;

}
/*嵌入*/
iframe{
margin:auto !important;
}

/*左側欄位*/
div#navSelector_store.navSelector {
margin-right: 0px !important;
width: 122px !important;
}

#navSelector_my {
margin-left: 0px !important;
padding-left: 20px !important;
width: 78px !important;
}

#feedlyTabs {
width: 208px !important;
padding-right: 10px !important;
padding-left: 2px !important;
}

#feedlyTabsHolder {
width: 224px !important;
}

div#feedlyTabs > div {
margin-top: 8px !important;
}

#mytab ,#savedtab {
padding-left: 8px;
}

#feedlyPart0.area {
padding-left: 8px !important;
}
/*內容*/
.entrybody {
font-size: 1.04em !important;
}

.inlineFrame .entryBody img {
margin: 0px auto;
}

.title {
max-width: 100% !important;
margin-bottom: 8px !important;
}

.frameActionsTop {
height: 13px !important;
}


.fx .entry.u4 .visual {
border-radius: 0.2rem;
height: 160px;
margin-right: 20px;
width: 220px;
}

.fx .entry.u4 {
border-bottom: 0;
border-left: 4px solid #ffffff;
border-radius: 0;
border-right: 0;
border-top: 0;
display: -webkit-flex;
display: flex;
margin-bottom: 32px;
margin-left: -16px;
margin-top: 0;
max-width: 100%;
padding-left: 12px;
}

関連するエントリー

PR

Y!mobile