【Stylebot】Google検索の「地図(マップ)」を非表示にするCSS
この記事では、Google検索で、食べ物や店の名前を検索した時に表示されるGoogleマップ欄を非表示にするCSSについて書きます。
ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を使います。
本記事で紹介するCSSを使えば、Googleの検索結果に表示される「マップ」欄を消すことができます。
Googleで、「飲食店」、「カフェ」、「カラオケ」といった店・場所を検索すると、大体2~4番目あたりに、「マップ」という項目が表示されます。
検索した単語に関連する場所・店が、Googleマップの2Dで表示されます。上部に地図、下部に店名、レビュー、営業時間などが表示されます。
人によっては、邪魔かもしれません。この機能、自動的に自分が住んでいる場所付近がヒットするようになっています。僕の場合、広島です。迂闊にこの画面をネット上に公開してしまうと、住んでいる地域がバレてしまう可能性があります。
配信者や、ブロガーさんは、非表示にしておくといいかもしれません。これまで通り、普通にGoogleマップは利用できます。あくまで、Google検索結果に載せないようにするだけです。
自身の環境上、非表示にしているだけなので、誰にも迷惑をかけませんし、いつでもオンオフを切り替えられます。本記事で紹介するStylebotは、Chrome拡張機能だけでなく、Firefox、Microsoft Edgeアドオンも用意されています。
おまけで、検索ボックス下に表示される「地図」ボタンを非表示にするコードも紹介します。
2022年7月8日に、全てのGoogleの不要項目を削除するまとめ記事を公開しました。
これまでは、1つずつ記事をチェックする必要がありましたが、上記記事を参考にすることで、「強調スニペット」、「関連する質問(旧:他の人はこちらも質問)」、「トップニュース」、「レシピ」、「マップ」、「動画」、「関連性の高い検索(他のキーワード)」、「フッターにある現在地」を、一気に全削除できます。
インストール方法
ウェブサイトに、自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を利用します。
Chromeウェブストアからインストールできます。Chrome拡張機能だけでなく、「Microsoft Edge」と「Firefox」版もあります。
「Chromeに追加」でインストールできます。
右上に拡張機能ボタンが追加されればOKです。詳しく使い方を知りたい方は、以下の記事を参考にしてみてください。
Google検索結果の「地図(マップ)」を非表示にするCSS
Googleで適当な単語を検索します。試しに、「ナポリタン」で検索してみます。僕の場合、3番目にマップが表示されました。
その状態で、インストールしたStylebotアイコン→「Stylebotを開く」をクリックします。
右側に白紙のサイドバーが表示されます。もし初めて「Stylebot」を起動した場合は、「ベーシック」という画面が表示されます。下部にある「コード」をクリックすると、白紙のスタイルシート画面を開けます。以下のコードを書き込みます。
/*「地図(マップ)」非表示*/
div[jsmodel="QPRQHf"] {
display: none;
}
下記画像のようになればOKです。書き込めたら、右上の「×」をクリックします。
再度拡張機能ボタンを押して、登録したサイト(例:www.google.com
)がオンになっていることを確認します。オンになっている間は有効になっているということです。
瞬時に反映されて、「マップ」項目がごっそり消えます。どの単語で検索した時でも表示されません。
「カラオケ」で検索した時の比較画像も貼っておきます。しっかり、非表示になっています。
ライトテーマ使用時も反映されます。
オンオフ切り替えたい時は、Googleの検索結果上で、拡張機能アイコンをクリック→「www.google.com
」をオフにします。これで、元通りマップが表示されます。完全に使わなくなった場合は書き込んだコードを削除します。
【おまけ】検索ボックス下の「地図」ボタン非表示
上記CSSは、検索結果に表示されるマップ欄を非表示にするだけです。検索ボックスの下にある「地図」ボタンも非表示にしたい場合、追加で下記のCSSを書き込みます。
/*検索ボックス下の「地図」ボタン非表示*/
a[href^="https://maps"] {
display: none;
}
「地図」ボタンが消えます。完全にマップからおさらばできます。Googleマップを開きたい場合は、URLを入力します。
感想
以上、Googleの検索結果に表示される「マップ」カテゴリーをごっそり非表示にするCSSについてでした。
Googleの「君がいる場所、ここでしょ?」という圧力、びっくりします。
本記事を含む合計8つの「Google検索を快適にする方法」記事を書きました。気になった方は、参考にしてみてください。