Google検索ボックスのスペルチェック(赤波線)を消す方法

Stylebot&Stylus

Stylebotのアイコン

この記事では、Google検索ボックスのスペルチェック(赤色の波線)を非表示にするCSSについて書きます。

ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を使います。

Google検索ボックスのスペルチェック機能を消すイメージ画像

本記事で紹介するCSSを使えば、Google検索ボックスの赤い波々線を非表示にできます。

通常、ブラウザ側のスペルチェック機能は、ブラウザの設定からオンオフできます。気になる方は、以下の記事を参考にしてみてください。Vivaldiブラウザでの解説ですが、Chromeでも一緒です。

Google検索ボックスでは、ブラウザ側の設定の有無に関わらず、自動的にスペルチェック機能が有効になっています。

間違った英単語を入力すると、自動的に「この単語間違っているんじゃないですか~?とりあえず、赤色の波下線引いておきますね」といった感じで、教えてくれます。

人によっては不要かもしれません。しかし、2022年5月時点では、設定項目がないので、オンオフできないようになっています。海外の記事にも書かれていました。

CSSを使うことで、無理やり非表示にできます。「Googleのスペルチェック機能邪魔すぎる!消したい!」という方、ぜひ参考にしてみてください。いつでもオンオフできます。

Stylebotは、Chrome拡張機能だけでなく、Firefox、Microsoft Edgeアドオンも用意されています。

インストール方法

ウェブサイトに、自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を利用します。

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

Firefox・Edgeをご利用の場合

Chrome拡張機能だけでなく、Microsoft EdgeFirefox版もあります。

「Chromeに追加」でインストールできます。

Stylebot - Chrome ウェブストア

右上に拡張機能ボタンが追加されればOKです。詳しく使い方を知りたい方は、以下の記事を参考にしてみてください。

CSS

Googleにアクセスします。右上の拡張機能アイコン→「Stylebotを開く」をクリックします。

Stylebot→Stylebotを開く

右側に白紙のサイドバーが表示されます。こちらにコードを書き込んでいきます。書き込むコードは、以下になっています。

/*Google検索ボックスのスペルチェック(赤下線)の非表示*/
.YacQv.gsfi span {
    display: none !important;
}

下記画像のようになればOKです。右上の「×」でスタイルシートを閉じます。

Stylebot Google検索ボックスのスペルチェック(赤波下線)を非表示にするコードを書き込んだ画面

再度拡張機能ボタンを押して、登録したサイト(例:www.google.com)がオンになっていることを確認します。オンになっている間は有効になっているということです。

「www.google.com」がオンになっていればOK

この状態で、適当にGoogleの検索ボックスに単語を入力します。正しい単語だと、そもそも波線が表示されないので、あえて間違った英単語を入力します。「jepanese(正しくは、japanese)」とかですね。

通常だと、スペルチェック機能が働いて、赤の波線が表示されますが、CSS適用後は、何も表示されなくなります。

Google検索ボックスのスペルチェックが非表示になる

どの単語でも有効になり、スペルチェックとおさらばできます。

「neporitan」と検索した時の適用前と適用後の比較画像

検索結果ページではなく、トップページの検索ボックス内でも有効になります。

Googleのトップページの適用前と適用後の比較画像

無効にしたい場合は、Stylebot→「www.google.com」をオフにするだけです。

感想

以上、Googleの検索ボックスのスペルチェック機能(赤色の波下線)をオフにする方法でした。

スペルが間違っている時に、赤色の波下線のPNG画像を表示する…といった処理がされていたので、このPNG画像を「display: none !important;」で消し去っています。

消し去るのではなく、「background: transparent !important;」で透明にしても、同様の効果が得られます。

Posted by ナポリタン寿司