【YouTube】左側サイドバーの不要な項目を削除するCSS

この記事では、YouTubeの左側サイドバーにある「ショート」、「後で見る」、「オフライン」、「急上昇」などの項目を削除してスッキリするCSSについて書きます。
ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を使います。
本記事で紹介するCSSを使えば、YouTubeの左側サイドバーにある以下のような項目を削除できます。消すことでスッキリします。
- ホーム
- ショート
- Originals
- YouTube Music
- ライブラリ
- 履歴
- 自分の動画
- 後で見る
- オフライン
- 自分のクリップ
- 探索(急上昇、学び、ニュースなど)
- YouTubeのその他のサービス
- 報告履歴
- ヘルプ
- フィードバックを送信
- フッター
「使っていない項目を削除してスッキリさせたい!」という方、参考にしてみてください。サクっと非表示にでき、いつでもオンオフできます。
左側サイドバーとは、以下の部分です。YouTubeにアクセスすると、左側に表示されます。

Stylebotは、Chrome拡張機能だけでなく、Firefox、Microsoft Edgeアドオンも用意されています。
インストール方法
ウェブサイトに、自分で作成したCSSを適用できるChrome拡張機能「Stylebot」を利用します。
Chromeウェブストアからインストールできます。
Chrome拡張機能だけでなく、Microsoft EdgeとFirefox版もあります。
「Chromeに追加」をクリックしてインストールします。

右上に拡張機能ボタンが追加されればOKです。詳しく使い方を知りたい方は、以下の記事を参考にしてみてください。
左側サイドバーの不要な項目を削除するCSS
「YouTube」にアクセスします。右上の拡張機能アイコン→「Stylebotを開く」をクリックします。

右側に白紙のサイドバーが表示されます。こちらにコードを書き込んでいきます。書き込むコードは、以下になっています。全部を書き込む必要はありません。自分が消したい項目だけコピペします。
/*左メニューの「ホーム」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ホーム"]) {
display: none;
}
/*左メニューの「ショート」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ショート"]) {
display: none;
}
/*左メニューの「Originals」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="Originals"]) {
display: none;
}
/*左メニューの「YouTube Music」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="YouTube Music"]) {
display: none;
}
/*左メニューの「ライブラリ」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ライブラリ"]) {
display: none;
}
/*左メニューの「履歴」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="履歴"]) {
display: none;
}
/*左メニューの「自分の動画」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="自分の動画"]) {
display: none;
}
/*左メニューの「後で見る」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="後で見る"]) {
display: none;
}
/*左メニューの「オフライン」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="オフライン"]) {
display: none;
}
/*左メニューの「自分のクリップ」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="自分のクリップ"]) {
display: none;
}
/*左メニューの「急上昇(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="急上昇"]) {
display: none;
}
/*左メニューの「音楽(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="音楽"]) {
display: none;
}
/*左メニューの「ライブ(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ライブ"]) {
display: none;
}
/*左メニューの「ゲーム(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ゲーム"]) {
display: none;
}
/*左メニューの「ニュース(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ニュース"]) {
display: none;
}
/*左メニューの「スポーツ(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="スポーツ"]) {
display: none;
}
/*左メニューの「学び(探索)」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="学び"]) {
display: none;
}
/*左メニューの「YouTubeのその他のサービス」一覧すべて削除*/
ytd-guide-section-renderer.ytd-guide-renderer:has(path[d^="M11.13 1.21c"]) {
display: none;
}
/*左メニューの「報告履歴」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="報告履歴"]) {
display: none;
}
/*左メニューの「ヘルプ」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ヘルプ"]) {
display: none;
}
/*左メニューの「フィードバックを送信」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="フィードバックを送信"]) {
display: none;
}
/*左メニューのフッター削除*/
#guide-content #footer {
display: none;
}
右上の「×」でスタイルシートを閉じます。

再度拡張機能ボタンを押して、登録したサイト(例:www.youtube.com)がオンになっていることを確認します。オンになっている間は有効になっているということです。
書き込んだ項目が綺麗に消えます。ショートやOriginals、後で見る、オフラインなど、使っていない項目はじゃんじゃん消してみましょう。

「ホーム」も人によっては不要かもですね。YouTubeロゴを押すことでもホームに戻れるので、役割が被っています。
探索項目も、自分の好きなジャンルだけにできます。

そもそも探索自体を丸々削除したい場合は、以下のコードを使ってみてください。
/*左メニューの「探索」一覧すべて削除*/
ytd-guide-section-renderer.ytd-guide-renderer:has(a#endpoint[title="急上昇"]) {
display: none;
}
一時的に無効化したい場合は、Stylebot→「www.youtube.com」をオフにします。完全に使わなくなった場合は、書き込んだコードを削除します。
ウィンドウを小さくした時用
YouTubeのウィンドウを小さくしたとき、フレキシブルで左側メニューが出現します。これらも削除したい場合は、以下のコードを追加で利用してみてください。
/*左メニューの「ホーム」削除*/
ytd-mini-guide-entry-renderer[aria-label="ホーム"] {
display: none;
}
/*左メニューの「ショート」削除*/
ytd-mini-guide-entry-renderer[aria-label="ショート"] {
display: none;
}
/*左メニューの「登録チャンネル」削除*/
ytd-mini-guide-entry-renderer[aria-label="登録チャンネル"] {
display: none;
}
/*左メニューの「Originals」削除*/
ytd-mini-guide-entry-renderer[aria-label="Originals"] {
display: none;
}
/*左メニューの「YouTube Music」削除*/
ytd-mini-guide-entry-renderer[aria-label="YouTube Music"] {
display: none;
}
/*左メニューの「ライブラリ」削除*/
ytd-mini-guide-entry-renderer[aria-label="ライブラリ"] {
display: none;
}
/*左メニューの「オフライン」削除*/
ytd-mini-guide-entry-renderer[aria-label="オフライン"] {
display: none;
}
以下の部分のことです。ウィンドウを一定の横幅まで狭めるとミニサイドバーに切り替わります。

感想
以上、YouTubeの左側サイドバーの項目を、CSSで綺麗にする方法でした。
僕は、ほとんど削除しています。かなりスッキリしていい感じです。

余談ですが、チャンネルページは、以下のようにカスタマイズしています。最近YouTubeのデザインが変わって、若干表示が崩れた部分もありますが、いちおまだ使えます。