広告を利用しています

当サイトは広告を掲載しています。消費者庁が2023年10月1日から施行した景品表示法の規制対象(通称:ステマ規制)にならないよう配慮して記事を作成しています(記事はこちら、消す方法はこちら

【Stylebot】Google「トップニュース」を非表示にするCSS

2022年4月19日Google

「Google」のアイコン

この記事では、Googleで検索した時に、一番上、または途中に表示される「トップニュース」欄を非表示にするCSSについて書きます。

ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebotスタイルボット」や「Stylusスタイラス」を利用します。

PCウェブサイト版「Google」のトップニュースに赤バツをつけている画像

本記事で紹介するCSSを使えば、Googleの検索結果の一番上または途中に表示される「トップニュース」を消すことができます。

Googleで調べものをした時、単語によりますが検索結果に「トップニュース」という欄が表示されることがあります。検索した単語に関連する最近のニュースが各ニュースサイト(毎日新聞、時事通信、NHK.JP、テレ朝 Newsなどなど)によって表示されます。

基本的には「〇〇〇 ニュース」と検索した時に表示される傾向にあります。「スマホ」など一部単語については「ニュース」とつけなくても表示されます。

つまり、ニュースを知りたくなくても単語によっては表示されてしまう場合があるということです。これは不便に思う人がいるかもしれない…と思い本記事ではCSSを使って非表示にする方法を紹介します。

CSSで自身の環境上非表示にしているだけなので、誰にも迷惑をかけませんし、いつでもオンオフ切り替えできます。本記事で紹介する「Stylebot」はChrome拡張機能だけでなくFirefox、Microsoft Edgeアドオンも用意されています。

Googleの他の不要な項目を一括削除したい方へ

2022年7月8日に全てのGoogleの不要項目を削除するまとめ記事を公開しました。

これまでは1つずつ記事をチェックする必要がありましたが、上記記事を参考にすることで「強調スニペット」、「関連する質問(旧:他の人はこちらも質問)」、「トップニュース」、「レシピ」、「マップ」、「動画」、「関連性の高い検索(他のキーワード)」、「フッターにある現在地」を一気に全削除できます。

インストール方法

Chromeウェブストアからインストールできます。

Chrome拡張機能だけでなく、「Microsoft Edge」と「Firefox」版もあります。本記事では「Stylebot」を紹介しますが、「Stylus」などでもOKです。僕はメインでは「Stylus」を使っています。

「Chromeに追加」をクリックします。

「Stylebot」拡張機能をインストールする手順画像1

「拡張機能を追加」をクリックします。

「Stylebot」拡張機能をインストールする手順画像2

拡張機能のオーバーフローメニューに追加されたらOKです。

「Stylebot」拡張機能をインストールする手順画像3

頻繁に開く場合は拡張機能のオーバーフローメニューを開いて、「Stylebot」の隣にあるピン留めアイコンをクリックします。ツールバーに直接配置されます。

「Stylebot」拡張機能を直接ツールバーに配置する手順画像

詳しい使い方を知りたい方は以下の記事を参考にしてみてください。

Googleから「トップニュース」を削除する手順

Googleで適当な単語を検索します。試しに「スマホ」で検索してみます。見事にニュース記事が一番上に表示されました。

Googleの検索結果に表示される「トップニュース」画像

Googleサイト上ならどのページでもOKです。その状態でインストールしたStylebotアイコン→「Stylebotを開く」をクリックします。

「Stylebot」のスクリーンショット1

右側に白紙のサイドバーが表示されます。もし初めて「Stylebot」を起動した場合は「ベーシック」という画面が表示されます。下部にある「コード」をクリックすると白紙のスタイルシート画面を開けます。以下のコードを書き込みます。

/*「トップニュース」非表示(2024年11月修正)*/
div:has(>div>div>div>g-section-with-header a[href*="&tbm=nws&"]) {
    display: none !important;
}

書き込めたら右上の「×」をクリックします。再度拡張機能ボタンを押して、登録したサイト(例:www.google.com)がオンになっていることを確認します。オンになっている間は有効になっているということです。

瞬時に反映されて「トップニュース」項目がごっそり消えます。どの単語で検索した時でも表示されません。

トップニュースを非表示にした画像

ライトテーマ使用時も反映されます。

ライトテーマ時で「トップニュース」を非表示にした画像
強調スニペットは表示される

トップニュースと同じく一番上に表示される「強調スニペット」という項目はこれまで通り表示されます。

Googleの検索結果トップに表示される強調スニペット画像

こちらも非表示にしたい場合、下記記事を参考にしてみてください。

トップニュースは検索結果の一番上に表示される場合と途中に表示される場合があります。上記CSSを使うことで途中に表示されるニュースに関しても非表示にできます。

トップニュースを非表示にする前と後の比較画像

オンオフ切り替えたい時は、Googleの検索結果上で拡張機能アイコンをクリック→「www.google.com」をオフにします。これで元通りトップニュースが表示されます。完全に使わなくなった場合は書き込んだコードを削除します。

「Stylebot」のスクリーンショット2

【おまけ】ニュースタブの非表示

上記CSSはあくまでトップニュースというカテゴリーを非表示にしているだけなので、通常の検索結果に表示されるニュース記事はこれまで通り表示されます。Yahoo!ニュースとか公式サイトの〇〇新聞とかですね。

検索ボックスの下にある「ニュース」タブも同様です。

Google検索結果の「ニュース」画像

ニュースタブが不要な場合は追加で下記のCSSを使ってみてください。

/*検索ボックス下の「ニュース」タブ非表示(2024年11月修正)*/
div[data-hveid="CBEQAA"]{
    display: none !important;
}
上記CSSを使って、ニュースタブを非表示にしてみた画像

感想

以上、Googleの検索結果に表示される「トップニュース」カテゴリーをごっそり非表示にするCSSについてでした。

「最近のニュースなんかいらない!純粋な検索結果だけが欲しい!」という方、ぜひ試してみてください。

2022年4月19日Google

Posted by ナポリタン寿司