Google Chrome以外のブラウザを使っている際に
Googleのサービスを使っていると右上に表示されるこれらの表示

「Chrome に切り替えよう」や「Google Chrome を入手」

切り替えない」や「利用しない」を押せば一時的に表示は消えますが、しばらく経つとまたヒョッコリ現れてきます。

この表示をキレイさっぱり消す方法をご紹介します。

拡張機能「Stylish」を使う

まずこの表示を非表示にするには、拡張機能(アドオン)が必要となります。

拡張機能(アドオン)とは、ブラウザに備わっていない機能を追加するもので、数ある拡張機能の中から今回は「Stylish」を使用します。

この「Stylish」はCSSと呼ばれる言語コードを指定して様々なウェブサイトの見た目を変更できる拡張機能です。

この「Stylish」は、以下のブラウザ等で使用することができます。

  • Microsoft Edge
  • Firefox
  • Vivaldi
  • Brave
  • (当たり前ですが)Google Chrome

などなど、基本的にChromiumベースのブラウザであれば動くと思います(動かなかったらごめんなさい)。

ブラウザに「Stylish」を追加

まずはご使用のブラウザに「Stylish」を追加してください。

Chromiumベースの場合

Microsoft EdgeVivaldiなどChromiumベースの方は以下のページから「Chromeに追加」→「拡張機能を追加」で追加できます。

Stylish – ウェブサイト用カスタムテーマchrome ウェブストア

https://chrome.google.com/webstore/detail/stylish-custom-themes-for/fjnbnpbmkenffdnngjfgmeleoegfcffe?hl=ja

Microsoft Edgeの場合

Microsoft Edgeの場合は、「他のストアからの拡張機能を許可する」を選択することで、追加できるようになります。

Firefoxの場合

Firefoxの方は以下のページから「Firefoxへ追加」→「追加」で追加できます。

Stylish – Custom themes for any websiteFirefox (ja) 向けアドオン

https://addons.mozilla.org/ja/firefox/addon/stylish/

「Stylish」でスタイルを作る

拡張機能を追加できたらブラウザのツールバーにあるStylishのアイコンを選択します。

  • アイコンがない場合は、右隣のパズルピースのアイコンを選択して、拡張機能一覧から「Stylish」を選択して下さい。

初めての利用の場合は、使用許諾を問われるので、良ければ「Agree」を選択します。

右上の「⋮」を選択します。

「スタイルを作る」を選択します。

名前をつける

まずはスタイル名を付けます。

名前は自由ですが、私は分かりやすく「Chromeアピール非表示」としていますが、なんでも構いません。

コードを入力する

右側のコード欄に以下のコードを入れてください。

iframe[src*="widget/callout"]
  {display:none !important;}
  • 大文字小文字全角半角があるので、コピー&ペーストをオススメします。

黄色い△!で警告が表示されますが、無視して構いません。

このコードをざっくり説明すると

iframe[src*="widget/callout"]

「Chromeに切り替えよう」の部分はiframeと言う要素で表示されており、その参照元(src)のURLに「widget/callout」が含まれるので、それらをこのコードで指定しています。

{display:none !important;}

これは表示を見えなくするコードで、「!important」はこのコードの優先順位を上げて、より強力に表示を見えなくするという感じです。
ホントざっくりですが。

適用先を指定する

次にこのコードをGoogleのみで有効にするように適用先を指定します。

ここで適用先を指定しておかないと、「iframe[src*=”widget/callout”]」に当てはまる要素がGoogle以外のウェブサイトでも表示されなくなってしまいます(多分ないと思いますが念の為です)。

コード欄の下にある「個別指定」を選択します。

「URL」を選択すると、複数の項目が出てくるので、
「正規表現に一致するURL」を選択します。

右側の入力欄に以下の文字列を入れてください。

https://.*google(.com|.co.jp).+

これによってGoogleだけで適用されるようになります。

この画像の様になっていればOKです。

保存して完了

最後に左上の「保存」を選択してください。

これで「Chromeに切り替えよう」が表示されなくなりました

お疲れ様でした。

もしも表示がおかしくなったら

この方法によって、一部表示がおかしくなったり、不具合などが出た場合には、ブラウザのツールバーから「Stylish」を開いて、「インストールされたスタイル」から、先ほど作ったスタイルを無効にしてください。

この方法はもしかしたら将来的に使えなくなるかも

現在、「Chromeに切り替えよう」の部分は”iframe”要素と”widget/callout”を含むURLで表示されていますが、Google様がこれらのコードを変更してしまうと、これまでの設定が無効になってしまう為、我々も「Stylish」のコード変更が必要になります。

スターミント
Updated!

© starmint