広告を利用しています

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

YouTubeの左側にある「ショート」項目を非表示にするCSS

2022年8月18日YouTube

YouTubeのアイコン

この記事では、PCウェブサイト版「YouTube」の左側にある「ショート」項目を非表示にするCSSについて書きます。

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

PCウェブサイト版「YouTube」の左側サイドバーにある「ショート」項目画像

通常、PCウェブサイト版「YouTube」の左側サイドバーには、「ショート」という項目があります。クリックすると、おすすめのショート動画が再生されます。人によっては、不要な項目かもしれません。

CSSを利用することで、非表示にできます。ショート動画を利用しない人におすすめです。自身の環境上で、他人には影響しません。

個人的にショート動画って、PCで見る分には不向きだと思っています。再生バーがないので、巻き戻しやスキップができません。唯一クリック(タップ)で、一時停止できるくらいです。コメント欄を開くのも一苦労です。

「いっそのこと、アクセスできないようにしたらいいじゃん!」と思ったので、本記事では、ショート動画にアクセスする最も近道であろうサイドバーの「ショート」を削除します。

本記事は、拡張機能を導入できるPCブラウザ向けです。スマホアプリ版ではできません。

インストール方法

Chromeウェブストアからインストールできます。Chrome拡張機能だけでなく、「Microsoft Edge」と「Firefox」版もあります。本記事では「Stylebot」を紹介しますが、「Stylus」などでもOKです。僕はメインでは「Stylus」を使っています。

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

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

「Stylebot(スタイルボット)」をインストールする手順画像

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

左側の「ショート」項目を非表示にするCSS

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

Stylebotのスクリーンショット1

「Stylus」拡張機能を使っている方は、右上の拡張機能アイコン→「次のスタイルを書く」の「www.youtube.com」をクリックします。新しいタブでスタイルシートが表示されるので、書き込んでいきます。書き込めたら、忘れずに「保存」をクリックします。

「Stylebot」拡張機能の場合、右側に白紙のサイドバーが表示されます。もし初めて「Stylebot」を起動した場合は、「ベーシック」という画面が表示されます。下部にある「コード」をクリックすると、白紙のスタイルシート画面を開けます。以下のコードを書き込みます。

/*左メニューの「ショート」削除*/
ytd-guide-entry-renderer:has(a#endpoint[title="ショート"]) {
    display: none !important;
}
注意事項

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

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

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

Stylebotのスクリーンショット2

再度拡張機能ボタンを押して、「www.youtube.com」がオンになっていることを確認します。オンになっている間は有効になっているということです。

左側サイドバーから「ショート」項目が非表示になります。ホームと登録チャンネルの間が詰められます。

PCウェブサイト版「YouTube」の左側サイドバーにある「ショート」項目をCSSで非表示にした画像

サイドバーのタブを非表示にするだけです。各チャンネルのホームページ、急上昇(探索)のショート欄は、これまで通り表示されます。

PC版「YouTube」の各チャンネルページや探索ページに表示されているショート動画画像

ショートのURL(https://www.youtube.com/shorts/〇〇〇)を直接開いた時も、正常に再生されます。

一時的に表示させたい場合は、「YouTube」にアクセスして、「Stylebot」拡張機能アイコンをクリック→書き込んだ「www.youtube.com」をオフにします。

その他の左側サイドバーの項目を非表示にしたい場合

同じくCSSのコードを書き込むことで、左側サイドバーにある別の項目を非表示にできます。「YouTube Music」、「後で見る」、「オフライン」、「急上昇」などです。詳しくは別記事にて書いています。参考にしてみてください。

【余談】ショート動画が嫌いな方へ!拡張機能が便利!

そもそもショート動画が不要という方に、参考になりそうな情報を書きます。

ショート動画を非表示にする拡張機能

「ショート動画は、邪魔!いらない…」と思っている方は、「No YouTube Shorts(ノー・ユーチューブ・ショート)」という拡張機能が役立つかもしれません。

YouTube上からショート動画を表示させないようにできます。拡張機能なので、導入できるPCブラウザ専用となります。スマホアプリ版ではできません。詳しくは、下記記事を参考にしてみてください。

ショート動画を通常動画のUIで再生してくれる拡張機能

「ショート動画は見たいけど、あのPCに最適化されていない感じのUIが嫌い…。せめて通常動画のUIだったらいいのにな…」という方は、「Youtube-shorts block(ユーチューブ・ショート・ブロック)」という拡張機能がおすすめです。

ショート動画のリンク(https://www.youtube.com/shorts/〇〇)をクリックした時、自動的に通常動画のリンク(https://www.youtube.com/watch?〇〇)へ変換(リダイレクト)して再生してくれます。

通常動画と同じUIなので、再生地点の変更、各種ボタンの機能、概要欄が下部に表示されてすぐに確認できます。詳しくは、下記記事を参考にしてみてください。

検索結果からショート項目を非表示にしたい場合

検索結果の途中途中に表示されるショート動画項目が不要な場合、ウェブサイトの外観を変えられるCSSを利用することで、見た目上消せます。詳しくは、下記記事を参考にしてみてください。

感想

以上、PCウェブサイト版「YouTube」の左側にある「ショート」項目を非表示にするCSSについてでした。

押さなければいいだけなので、あんまり需要はないかもしれませんねぇ。見栄えがスッキリするかな?といった感じです。

2022年8月18日YouTube

Posted by ナポリタン寿司