【YouTube】右上の作成ボタンや「ライブ配信を開始」を非表示にするCSS

2024年9月4日YouTube

この記事では、PCウェブサイト版「YouTube」の右上にある作成ボタンを丸ごと非表示にするCSS、あるいは中にある「ライブ配信を開始」などを個別に消すCSSを紹介します。

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

PCウェブサイト版「YouTube」にログインするとヘッダーの右端に作成ボタン（）があります。クリックすると「動画をアップロード」、「ライブ配信を開始」、チャンネルによっては「投稿を作成」の3つが表示されます。

読者様からここをCSSで非表示にできますか？と問い合わせをいただきました。確かに見る専で一切動画をアップロードしない方からしたらあっても邪魔なだけだと思います。その隣の通知アイコンと押し間違える可能性もありますね。

本記事で紹介するCSSを利用することで、CSSを導入したブラウザ上だけの反映ですが非表示にできます。最初からなかったかのようにできます。

拡張機能・Firefoxアドオンを導入できるPCブラウザ専用、サイトの仕様変更によって使えなくなる可能性がある…といったように制限もありますが、どうしても今非表示にしたい方参考にしてみてください。

以前「ライブ配信を開始」項目だけ消すCSS記事を書いていましたが、非公開にして本記事にまとめます。

インストール方法

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

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

Stylebot

Change the appearance of the web instantly

 https://chromewebstore.google.com/detail/stylebot/oiaejidbmk...

「Chromeに追加」をクリックします。

「拡張機能を追加」をクリックします。

拡張機能のオーバーフローメニューに追加されたらOKです。

頻繁に開く場合は拡張機能のオーバーフローメニューを開いて、「Stylebot」の隣にあるピン留めアイコンをクリックします。ツールバーに直接配置されます。

詳しい使い方を知りたい方は以下の記事を参考にしてみてください。

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

この記事では、ウェブサイトに自分で作成したCSSを適用できるChrome拡張機能「Stylebot（スタイルボッ ...

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

YouTubeの右上にある作成ボタンを消すCSS

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

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

以下の中から自分が消したい項目のCSSをコピペしてスタイルシートに貼り付けます。

/*右上の「作成」ボタン非表示*/
div#container #end button[aria-label="作成"] {
    display: none !important;
}

/*右上の作成ボタン内にある「動画をアップロード」非表示*/
#endpoint[href*="/upload"] {
    display: none !important;
}

/*右上の作成ボタン内にある「ライブ配信を開始」非表示*/
#endpoint[href*="/livestreaming"] {
    display: none !important;
}

/*右上の作成ボタン内にある「投稿を作成」非表示*/
#endpoint[href*="/community"] {
    display: none !important;
}

例えば作成ボタン自体を丸々消したい場合は、下記画像のようになればOKです。右上の「×」でスタイルシートを閉じます。

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

右上から作成ボタン（）が非表示になります。通知ボタンを押そうと思って作成ボタンを押し間違えちゃう…ってことがなくなると思います。

「動画はアップロードするから作成ボタンは残しておきたい！ライブ配信と投稿が不要！」って場合は、下記画像のようにCSSを書き込みます。作成ボタンは残ってクリックした時のメニュー内から該当項目が非表示になります。

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

YouTube Studioの右上にある各項目を非表示にするCSS

YouTubeとYouTube Studioはドメインが異なるし中身の構造も異なるため、CSSの使いまわしができません。

「YouTube Studio」上の右上にある作成ボタン、あるいはクリックした時のメニュー項目を個別に非表示にしたい場合は別のCSSを利用します。以下です。

/*右上の作成ボタン非表示*/
ytcp-button#create-icon {
    display: none !important;
}

/*右上の作成ボタン内メニューの「動画をアップロード」非表示*/
#paper-list>[test-id="upload-beta"] {
    display: none !important;
}

/*右上の作成ボタン内メニューの「ライブ配信を開始」非表示*/
#paper-list>[test-id="live"] {
    display: none !important;
}

/*右上の作成ボタン内メニューの「投稿を作成」非表示*/
#paper-list>[test-id="create-post"] {
    display: none !important;
}

/*右上の作成ボタン内メニューの「新しい再生リスト」非表示*/
#paper-list>[test-id="new-playlist"] {
    display: none !important;
}

/*右上の作成ボタン内メニューの「ポッドキャスト」非表示*/
#paper-list>[test-id="new-podcast-show-selector"] {
    display: none !important;
}

1つ目が作成ボタン自体丸々非表示で2つ目以降が各項目です。「YouTube Studio」にアクセスしてStylebotアイコン→「Stylebotを開く」でスタイルシートに書き込みます。

例えば僕の場合ライブ配信を開始、投稿を作成、ポッドキャストを利用していないので以下のようにしています。

感想

以上、PCウェブサイト版「YouTube」と「YouTube Studio」で右上にある作成ボタンを丸々消す方法、及びその中の「投稿を作成」や「ポッドキャスト」といった各項目を個別に消すCSSでした。

YouTube関連のCSS記事は他にも書いているので気になった方はカテゴリーをチェックしてみてください。

YouTube | ナポリタン寿司のPC日記

ナポリタン寿司のPC日記 | YouTubeカテゴリー記事一覧

 https://www.naporitansushi.com/category/stylebot-stylus/css-...