Googleカスタム検索のサムネイル画像を非表示にする方法|拡張機能「Stylus」

Googleカスタム検索のサムネイル画像の表示・非表示を切り替える方法について、問い合わせがあったのでアンサー記事を書いておきます。

ノイズレスサーチでも利用しているGoogleカスタム検索の初期設定では、サムネイル画像のオンオフをユーザー側で切り替えることができません。

なので、ちょっとハードルは高いかもしれませんが、ユーザー側で設定できる方法を書いておきます。(ただしパソコンのみです。スマホ・タブレットではできません)

スポンサーリンク

Googleカスタム検索はデフォルトでサムネイル画像が表示される

Googleカスタム検索は普通のGoogle検索と違い、検索結果にサムネイル画像が最初から表示されます。

↓こちらはノイズレスサーチの検索結果のキャプチャ。レシピの写真が表示されるのでわかりやすくなりますね。

これが美味しいレシピの画像ならとても見やすく有用なんですが、例えば虫などについて検索すると、ショッキングな画像が表示される可能性もあります。

今回問い合わせいただいたのも、たまに心臓に悪いような画像が表示されて驚くので非表示にしたい、ということです。

↓例として「ヒアリ」の検索結果がこちら。

なので、理想は「ユーザー側でサムネイル画像の表示を切り替えできる」ことなんですが、Googleカスタム検索では管理者しか設定を変更できません。

そしてノイズレスサーチではレシピ検索なども利用者が多いため、サムネイル画像を非表示にすることはできません。

ーーー

なので、ややハードルは高いですが、ユーザーが自分でサムネイル画像を非表示にする方法をまとめておきます。

検索結果のサムネイル画像を非表示にする方法

今回は「Stylus」という拡張機能を利用します。

Chrome拡張機能:Stylus
Firefoxアドオン:Stylus

ChromeとFirefoxどちらにもありますが、以下、Chrome拡張機能の場合で説明していきます。

※以前は「Stylish」という拡張機能を使っていましたが、ポリシー違反でFirefoxからもChromeからも削除されてしまったようです。

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

Stylusはほぼ同じ設定画面で上位互換のようなので、現在まだStylishが使えている人も、Stylusへの乗り換えを推奨します。

Stylusの設定は、右上のほうにある設定ボタンが現れるのでクリックして、「管理」をクリック。

「新スタイルを作成」をクリック。

そしたら設定画面に必要な情報を入力。

「コード」の入力欄は以下のコードをコピペ。

最後に保存をクリックして完了です。

これでサムネイル画像が表示されなくなりました。

サムネイル画像が必要な時は、右上の設定ボタンからチェックマークをクリックすれば簡単に切り替えできます。

スマホでサムネイル画像を非表示にできるか

残念ながらiPhoneやAndroidスマホ・タブレットでは、ユーザー側で画像を非表示にする方法は無いと思います。

いろいろ検索してみましたが、サイト運営者がデザインを変更する情報ばかりでした。

申し訳ありませんが、スマホやタブレットではサムネイル画像が表示されることをご了承ください。

むしろ解説しているサイトを知っていたら教えてほしいです。

上級者向けtips

上記の説明は、「ノイズレスサーチでサムネイル画像を非表示にする方法」に限定していますが、要するに画像のgs-image-boxという部分をdisplay:none;で非表示にしているという仕組みなので、他のウェブサイトでも使えるテクニックです。

自分で非表示にしたい部分を探す場合はF12Ctrl+Shift+Cで呼び出すデベロッパーツールを使います。

使い方がわからなければ「デベロッパーツール 使い方」で検索すれば情報は転がってます。

ーーー

スポンサーリンク

このページのシェア・保存はこちら

スポンサーリンク

著者のフォローはこちら

名前:
Twitter
YouTube

ーーー

制作物:「ノイズレスサーチ

プロフィール
問い合わせフォーム
当サイトご利用時の注意事項

コメント(本文のみでOK。URL含むコメントは承認待ちになります)

メールアドレスが公開されることはありません。