Ribbit.work

記事のトップ画像

Youtubeのシアターモードを画面ギリギリまで大きくする

note

last modified date2021-8-12

publish date2021-8-11

Youtubeのシアターモード、みなさんは利用していますか?

フルスクリーンは嫌、でも画面はギリギリまで大きく表示したい。というわがままな要望に応えてくれるのが、シアターモードです。

ただ、動画タイトルを表示させるためなのか、標準では横幅は上限まで広がっても、縦幅が上限まで広がらないような設定となっています。

今回はこの部分を改善して、シアターモード時は画面上部のヘッダーと動画のみとなるように設定する方法をご紹介致します。 ちなみに、動作確認しているブラウザはGoogle ChromeとFirefoxのみです。

「Stylus」プラグインをインストール

まず、変更を適用するためのプラグインをインストールします。

Chromeをお使いの方はこちらから

Firefoxをお使いの方はこちらから

Stylusの設定

Stylusのインストールが終わったら、画面右上にStylusのアイコンが追加されます。

その上で、Youtubeにアクセスし、アイコンをクリックしてみてください。

youtube-stylus

すると、このような画面が表示されると思います。

そこで、www.youtube.comが選択された状態でクリックしてください。

新しいタブが開き、エディタが表示されます。
そこに、以下のコードをコピーして貼り付けてください。

#player-theater-container {
    max-height: calc(100vh - 56px) !important;
}

保存ボタンをクリックすれば完了です。

適当な動画を開いて確認してみてください。