広告を利用しています

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

【Firefox】「Google アカウントを使用して〇〇にログインできます」を非表示にする方法・CSS

ブラウザ

Firefoxのアイコン画像

この記事ではPC版「Firefox」ブラウザでGoogleアカウントのログイン系サービスにアクセスした時右上に表示される「Google アカウントを使用して〇〇にログインできます」ポップアップを非表示にする方法を書きます。

【Firefox】「Google アカウントを使用して〇〇にログインできます」を非表示にする方法・CSS

Firefox系のブラウザでGoogleアカウントを使ってログインできる系のサービス(例:Reddit)にアクセスすると、サイト右上に「Googleでログイン」ポップアップが表示されることがあります。

Firefoxブラウザで表示される「Google アカウントを使用して〇〇にログインできます」ポップアップ画像

「Google Chrome」ブラウザを使っている場合は、以下記事の方法で非表示にできます。

Firefox系だと上記記事で紹介している設定ページにアクセスできないのでできません。

代わりにGoogleアカウントの設定から調整、あるいはCSSを使って無理やり消すことで非表示にできます。

Googleアカウントの設定ページからオフにする方法

本設定はAndroid上でFirefoxを使っている場合に限ります。

PCからだと設定しても意味なかったです。変わらず表示され続けました。PCからFirefoxブラウザを使っている場合はCSSで無理やり消すしか方法がないっぽいです。(こちら

サードパーティ製のアプリとサービスページを開く

Googleのアカウントの以下リンクを開きます。

以下、上記リンクが開けない、あるいはどこに設定があるか理解したいから自分でポチポチクリックして開きたいって方向けに設定へのアクセス方法を記載します。

どうでもいい!上記リンクで開けた!って方はこちらに飛んでください。

Googleアカウントサービスページを開きます。左側サイドバーの「セキュリティ」をクリックします。

Googleアカウントの「セキュリティ」設定ページを開く手順画像

ページを下にスクロールして「サードパーティ製のアプリとサービスへの接続」の「すべての接続を表示」をクリックします。

Googleアカウントの「サードパーティ製のアプリとサービス」ページを開く手順画像

Googleログインメッセージをオフにする

右上にある歯車ボタンをクリックします。

Googleアカウントの「サードパーティ製のアプリとサービス」の設定ページを開く手順画像

「ログイン メッセージ」のトグルをクリックしてオフにします。

Googleアカウントの設定から「ログイン メッセージ」をオフにする手順画像

これでAndroidスマホのブラウザで開いた時ログインメッセージが表示されなくなります。

PC版Firefoxだとここをオフにしたところで変わらず右上に表示されました。

サイトごとの「Googleでログイン」機能の使用を停止は無関係

歯車ボタンではなく登録されているサイト名をクリックして「詳細を表示」をクリックします。

Googleアカウントの特定サイトへのログイン設定ページを開く手順画像

ここに「Googleでログイン」機能の使用を停止ってボタンがあります。

Googleアカウントに登録した特定サイトのログイン機能を停止する手順画像

以前ここをオフにすればログインメッセージをオフにできるって紹介していたブログを見たことがありました。

実際試してみましたが、単にGoogleアカウントの紐づけが解除されただけで、右上の「Google アカウントを使用して〇〇にログインできます」ポップアップは表示され続けました。

CSSを使って無理やり非表示にする手順

CSS拡張機能をインストールする

Stylebot」、「Stylus」などなんでもいいのでCSSを任意のサイトに適用できるFirefoxアドオンをインストールします。

以下、拡張機能での使い方ですが「Stylebot」について書いています。本記事は既にインストール済み・使い方もある程度知っている前提で書きます。

スタイルシートを作成する

特定のサイトのみで使う

適用したいサイトのスタイルシートを作成します。特定のサイト上のみで使いたい場合はそのサイトにアクセス→拡張機能をクリックしてスタイルシートの作成ボタンを押します。

「Stylebot」だと以下画像です。

Firefoxにインストールした「Stylebot」拡張機能でスタイルシートを開く手順画像

「Stylus」だと以下画像です。

Firefoxにインストールした「Stylus」拡張機能でスタイルシートを開く手順画像

特定のサイトのみで使う方法だと、それ以外のサイトにアクセスした時はいつもどおりログインメッセージが表示されてしまいます。

ただし、絞っている分予期せぬ事故は起こりにくくなります。CSSの表示崩れとかね。仮に起きてもそのサイトだけで発生するので他サイトには影響しません。

全サイト上で使う

「Stylebot」だと、拡張機能の設定ページを開いて左側の「スタイル」→「新しいスタイルを追加」をクリックします。

1つ目のURL指定部分に「https://**」といった感じで書き込みます。

https://**

https://**」から始まる全てのサイト上で発動するスタイルシートになります。

「Stylebot」拡張機能にGoogleログインポップアップを消すCSSを書き込んでいる画像

「Stylus」だと適当にスタイルシート作成画面を開いてURLの指定方法を「すべて」にします。

Firefoxにインストールした「Stylus」拡張機能の適用範囲をすべてのサイトにする手順画像

CSSを書き込む

以下のCSSコードをスタイルシートに書き込みます。

CSS
/*右上に表示される「Googleアカウントを使用して〇〇にログインできます」非表示*/
#credential_picker_container:has(>[src^="https://accounts.google.com"]) {
	display: none !important;
}
注意事項

本記事のCSSは僕が適当に作成したコードです。皆さんの環境によっては使えなかったり、サイト側の仕様変更でいつの間にか使えなくなる可能性もあります。

もし書き込んでも反映されない場合、問い合わせより教えていただければ幸いです。初心者の僕ができる範囲で修正したいと思います。

適用されたか確認

実際にGoogleのログインポップアップが表示されていたサイト(例:Reddit)を開きます。

表示されなくなります。

FirefoxブラウザでCSSを使ってGoogleログインポップアップを非表示にした画像

CSSをオフにしてページをリロードすると元通り表示されます。

あくまで右上のポップアップを消しているだけなのでログインができないわけではないです。サイト自体に用意されているログイン機能を使えば問題なくログインできます。

感想

以上、PC版「Firefox」ブラウザで「Google アカウントを使用して〇〇にログインできます」ポップアップを非表示にする方法でした。

本記事は結構適当なのであんまり鵜呑みにはしないほうがいいかなと思います。基本非表示にするのはやっぱりChromeユーザー向けなんでしょうね。

ブラウザ

Posted by ナポリタン寿司