【ChatGPT】左側の「オファーを受け取る」を非表示にするCSS

2024年3月22日2026年2月23日Stylebot&Stylus(CSS)ChatGPT

この記事では、PCウェブサイト版「ChatGPT」の左下に表示される「オファーを受け取る（現在のプランをアップグレードする）」と上部ヘッダーの「Plus をはじめる」、「無料オファー」を非表示にするCSSを書きます。

ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebotスタイルボット」や「Stylusスタイラス」を利用します。

「ChatGPT」の無料版を使っていると、左側サイドバーの左下に「オファーを受け取る」という項目が表示されます。「現在のプランをアップグレードする」だったり、定期的に文言は変わっています。

クリックすると「https://chat.openai.com/#pricing」ページ（ダイアログ）が表示されます。用意されているプランと価格が表示されています。

無料で満足していて「ChatGPT Plus」にはアップグレードしない方には不要だと思います。CSSを使うことで自身の環境上だけで見えないよう隠せます。

いつでもオンオフできるので、いざアップグレードしたくなった時でも大丈夫だと思います。拡張機能を導入できるPCブラウザ向けです。スマホやタブレットのアプリ版ではできません。

「ChatGPT」側のアップデートにより使えなくなる可能性があります。その時は記事を更新したいと思いますが、忘れている時があります。その場合問い合わせより連絡いただければなと思います。

【PR】OpenAI o1搭載のSEOライティングツール「トランスコープ」

1. 前提
2. 「ChatGPT」の「オファーを受け取る」を消すCSS
3. 【追記】上部の「Plus をはじめる」、「無料オファー」非表示
4. 左側サイドバーのSoraやチャットを検索を非表示にするCSS
5. Google Gemini
6. 感想

前提

「Stylebot」や「Stylus」などのCSSを適用できる拡張機能を既に導入している前提です。

【Stylebot】サイトにCSSを適用できる拡張機能の使い方

この記事では、ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot」について書き ...

https://www.naporitansushi.com/stylebot/

「ChatGPT」の「オファーを受け取る」を消すCSS

スタイルシートを開く

「ChatGPT」にアクセスして適当に会話ページを開きます。

インストールした「Stylebot」拡張機能アイコンを左クリック→「Stylebotを開く」をクリックします。

右側に白紙のサイドバーが表示されます。

もし初めて「Stylebot」を起動した場合は「ベーシック」という画面が表示されます。下部にある「コード」をクリックすると白紙のスタイルシート画面を開けます。

CSSを書き込む

以下のコードを書き込みます。

CSS

/*左側サイドバーの「オファーを受け取る」非表示（2026年02月20日修正）*/
*:has(>[aria-label*="オファー"]) {
    display: none !important;
}

/*メニュー内の「プランをアップグレードする」非表示（2026年02月20日作成）*/
*:has(>[data-testid*="profile-menu"])>[role="menuitem"]:nth-of-type(3) {
    display: none !important;
}

/*左側サイドバーの「オファーを受け取る」非表示（2026年02月20日修正）*/
*:has(>[aria-label*="オファー"]) {
    display: none !important;
}

/*メニュー内の「プランをアップグレードする」非表示（2026年02月20日作成）*/
*:has(>[data-testid*="profile-menu"])>[role="menuitem"]:nth-of-type(3) {
    display: none !important;
}

注意事項

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

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

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

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

非表示になったか確認

「オファーを受け取る」が非表示になります。些細な点ですが画面のゴチャゴチャが減ります。

PCウェブサイト版「ChatGPT」の左側サイドバーに表示される「現在のプランをアップグレードする」をCSSで非表示にした画像

左下のプロフィール名をクリックした時にでてくるメニュー内の「プランをアップグレードする」も非表示にします。

「ChatGPT」のプロフィールメニュー内にある「プランをアップグレードする」画像

ただし、こっちのCSSはピンポイント非表示ではなく、メニュー内の何番目にある項目を非表示にするっていう作りのCSSになっています。そのため、ChatGPT側が仕様変更してきた時、もしかしたら新しく追加された項目が非表示になってアップグレードボタンがずれて表示される…みたいなおかしな現象が起きる可能性があります。

一時的に無効化したい場合は、「Stylebot」拡張機能アイコンを左クリック→「chat.openai.com」をオフにします。完全に使わなくなった場合は、書き込んだコードを削除します。

【追記】上部の「Plus をはじめる」、「無料オファー」非表示

2025年のどこかのタイミングから、新規チャット作成ページ（トップページ）の上部ヘッダーに「Plus をはじめる」ボタンが表示されるようになりました。

2025年12月から会話部屋上部に「無料オファー」が表示されるようになりました。

以下のCSSで両方とも消せます。

CSS

/*トップページ上部ヘッダーにある「Plus をはじめる」、「無料オファー」非表示(2026年01月14日修正)*/
header#page-header .bg-\[\#F1F1FB\].text-\[\#5D5BD0\] {
    display: none !important;
}

/*トップページ上部ヘッダーにある「Plus をはじめる」、「無料オファー」非表示(2026年01月14日修正)*/
header#page-header .bg-\[\#F1F1FB\].text-\[\#5D5BD0\] {
    display: none !important;
}

左側サイドバーのSoraやチャットを検索を非表示にするCSS

以下の記事を参考にしてみてください。

【ChatGPT】左側サイドバーのチャットを検索、アプリ、プロジェクトなど非表示にするC

この記事では、PCウェブサイト版「ChatGPT」の左側サイドバーに表示されている新しいチャット、チャッ ...

https://www.naporitansushi.com/chatgpt-hide-sidebar-search-s...

Google Gemini

【Gemini】「Google AI Plusにアップグレード」を非表示にするCSS

この記事では、PCウェブサイト版「Google Gemini」の右上にある「Google AI Plus にアップグレード」を ...

https://www.naporitansushi.com/gemini-hide-google-ai-plus-up...

感想

以上、PCウェブサイト版「ChatGPT」の「オファーを受け取る（現在のプランをアップグレードする）」と上部ヘッダーの「Plus をはじめる」、「無料オファー」を非表示にするCSSでした。

2024年3月22日2026年2月23日Stylebot&Stylus(CSS)ChatGPT

Posted by ナポリタン寿司