【Yahoo!ニュース】サイドバーにあるおすすめの有料記事非表示

この記事では、「Yahoo!ニュース」の記事ページの右側サイドバーにある「おすすめの有料記事」欄を非表示にするCSSを書きます。
ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot(スタイルボット)」を使います。
本記事で紹介するCSSを使えば、「Yahoo!ニュース」の記事ページの右側サイドバーにある「おすすめの有料記事」欄を消せます。
通常、記事ページを開いたら、右側の追従サイドバーに「おすすめの有料記事」項目が表示されます。「税込〇〇円」と書かれていて、クリックしても全文が読めないようになっています。

どうしても消したい方、参考にしてみてください。利用は自己責任ですが…。
もし、個別ごとではなく、サイドバー自体を消したい場合は、以下の記事を参考にしてみてください。
「Stylebot(スタイルボット)」は、Chrome拡張機能だけでなく、Firefox、Microsoft Edgeアドオンも用意されています。
インストール方法
ウェブサイトに、自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を利用します。
Chromeウェブストアからインストールできます。
Chrome拡張機能だけでなく、Microsoft EdgeとFirefox版もあります。
「Chromeに追加」をクリックしてインストールします。

右上に拡張機能ボタンが追加されればOKです。詳しく使い方を知りたい方は、以下の記事を参考にしてみてください。
サイドバーの「おすすめの有料記事」欄を消すCSS
「Yahoo!ニュース」にアクセスします。トップページ、どこかの記事ページ、どちらでもOKです。インストールした「Stylebot」アイコンをクリック→「Stylebotを開く」をクリックします。

右側に白紙のサイドバーが表示されます。こちらにコードを書き込んでいきます。書き込むコードは、以下になっています。
/*サイドバーにある「おすすめの有料記事」非表示*/
section[class^="ArticlePaidNewsRecommend"] {
display: none !important;
}
「ArticlePaidNewsRecommend
」が有料記事を指していて、そこを「display: none;
」で非表示にしています。
下記画像のようになればOKです。右上の「×」でスタイルシートを閉じます。

再度拡張機能ボタンを押して、登録したサイト(例:news.yahoo.co.jp
)がオンになっていることを確認します。オンになっている間は有効になっているということです。
適当に記事ページを開きます。サイドバーの「おすすめの有料記事」欄が消えます。それ以外の「コメントランキング」や「動画アクセスランキング」などは、これまで通り表示されます。

一時的に無効化したい場合は、Stylebot→「news.yahoo.co.jp
」をオフにします。完全に使わなくなった場合は、書き込んだコードを削除します。
感想
以上、「Yahoo!ニュース」の記事ページのサイドバーに表示される「おすすめの有料記事」欄を、CSSで非表示にする方法でした。