02.3 — CHROME EXTENSION
TubeLayout
YouTube の再生ページを、見やすい配置に戻す。
zip・37 KB／2026-10-12 更新／パソコン版の Google Chrome 用
SPEC
- 対応
- YouTube の再生ページ（パソコン版）
- 権限
- 設定の保存（storage）のみ。動くのは www.youtube.com だけ
- 通信
- 拡張機能からの通信なし
- 保存先
- 設定は Chrome の同期ストレージ（同期がオンなら同じ Google アカウントの Chrome 間で共有）。動作の確認用の記録はこの Chrome の中だけ
- バージョン
- 0.7.0
- 動作環境
- パソコン版の Google Chrome（ウェブストアを通さずに導入）
- ライセンス
- MIT（無料・無保証）
FEATURES
できること
どれも設定画面から個別に選べます。
-
新しいレイアウトを、以前の形に戻す
YouTube が試験的に出している新しい再生ページ（関連動画がプレイヤーの下にグリッドで並び、概要やコメントは右端のボタンから開く形）を使わず、プレイヤーの右に関連動画が並ぶ以前のレイアウトで表示します。
-
プレイヤーの大きさを変える
横長のウィンドウで左右に出る余白をなくす「横幅いっぱい」のほか、高さ・幅の上限、角を丸めない、周りの光（アンビエント モード）を消す、を選べます。縦長の動画は大きく伸ばさず、通常どおりに表示します。
-
関連動画の位置と見た目
関連動画を右・左・表示しないから選べます。列の幅、サムネイルの幅、タイトルの文字の大きさも変えられ、絞り込みボタンやショート動画を隠すこともできます。
-
コメント・概要欄・アイコン列
コメントを関連動画の上（横の列）に置いて、動画を見ながら読めるようにできます。概要欄を最初から開く、右端のアイコン列を関連動画の上に横一列で並べる・隠す、もできます。
-
タイトルとボタンの周り
タイトルの文字の大きさを変えたり、共有・保存などのボタンの文字やボタンの列、チケット・グッズの棚を隠したりできます。
-
見取り図で確かめながら設定する
設定画面には、設定に合わせて動く再生ページの見取り図があります。図の部分をクリックすると、その設定へ移動します。変更はすぐに保存され、開いている YouTube のタブにもその場で反映されます。
YouTube の変更で効かなくなることがあります
YouTube は再生ページの作りを予告なく変え、アカウントごとに試験的な画面を出しています。TubeLayout はその作りに合わせて動いているので、YouTube の変更で一部の設定が効かなくなることがあります。
設定画面の「動作の確認」に、最後に開いた再生ページの状態（レイアウトの種類・関連動画の位置など）が出ます。うまく動かないときはここを見てください。直した版はこのページで配布します。
INSTALL
導入方法
パソコン版の Google Chrome で、数分でできます。
-
zip をダウンロードして展開する
このページの「ダウンロード」から zip を保存し、展開（解凍）します。できた「tubelayout」フォルダを、ドキュメントなど消さない場所に置きます。
拡張機能はこのフォルダから読み込まれ続けます。導入した後は、フォルダを消したり動かしたりしないでください。
-
拡張機能の管理画面を開く
Chrome のアドレスバーに
chrome://extensionsと入力して開きます。右上のメニュー（︙）の「拡張機能」→「拡張機能を管理」からも開けます。 -
「デベロッパー モード」をオンにする
管理画面の右上にある「デベロッパー モード」のスイッチをオンにします。ウェブストアを通さない拡張機能を入れるために必要です。
-
フォルダを読み込む
左上に出る「パッケージ化されていない拡張機能を読み込む」を押し、手順 01 の「tubelayout」フォルダを選びます。中に
manifest.jsonが入っているフォルダです。一覧に TubeLayout が出れば導入できています。ツールバーのパズルのアイコンから、ピン留めしておくと便利です。
-
YouTube のタブを開き直して、設定する
すでに開いている YouTube のタブは、再読み込みしてから使います。入れた直後から、新しいレイアウトは以前のレイアウトに戻ります。
ほかの項目は最初は YouTube の既定のままです。ツールバーの TubeLayout のアイコンを押すと設定画面が開くので、変えたい項目を選んでください。
Chrome ウェブストアを通さない配布について
ウェブストアの審査は受けていません。そのかわり、中身はビルドしていない JavaScript なので、zip を展開すればソースコードをそのまま読めます。GitHub でも公開しています。どの拡張機能も、決められたサイト以外とは通信しません。
ライセンスは MIT です。無料で使え、改変や再配布もできますが、動作の保証はありません。
UPDATE
更新方法
新しい版が出たときの入れ替え方です。
-
新しい版をダウンロードして展開する
新しい版が出たら、このページの「ダウンロード」から zip を保存して展開します。自動では更新されないので、ときどきこのページの「更新履歴」を確認してください。
-
フォルダの中身を入れ替える
導入したときの「tubelayout」フォルダの中身を、新しい版のものに入れ替えます（フォルダごと差し替えても構いません）。
-
管理画面で再読み込みする
chrome://extensionsを開き、TubeLayout の再読み込みボタン（↻）を押します。開いていた YouTube のタブは再読み込みしてください。
拡張機能を「削除」しないでください
管理画面で「削除」を押すと、設定も一緒に消えます。更新するときは、上の手順のとおり入れ替えて再読み込みしてください。
新しい版を別の場所に展開した場合も、削除はせずに「パッケージ化されていない拡張機能を読み込む」で新しいフォルダを選んでください。今の TubeLayout と置き換わり、設定はそのまま残ります。
UNINSTALL
削除するには
chrome://extensions を開き、TubeLayout の「削除」を押します。設定も消えます。そのあと「tubelayout」フォルダを消して構いません。YouTube のタブを再読み込みすると、元の表示に戻ります。
CHANGELOG
更新履歴
新しい順です。
-
v0.7.0
- 「横幅いっぱい」のとき、4:3 などの動画や関連動画の列を隠したときに、プレイヤーが画面の高さを越えて大きくなっていたのを直しました。高さは画面に収まるところで止め、それより横長になる分は動画の左右に黒帯が出ます
- 「動画の縦横比によらず高さをそろえる」を加えました（既定はオフ。タブの読み込み直しで反映）。YouTube は 4:3 などの動画でプレイヤーの高さと関連動画の列の幅を変えるので、プレイヤーの枠を 16:9 に固定し、列の幅を一定にします
-
v0.6.0
- vel.works での配布を始めました
- 設定画面を、デジタル庁デザインシステムの基礎（色・文字・余白・角の形・フォーカス表示）に合わせて整えました。切り替えスイッチはチェックボックスにし、選択肢には選択中を示す丸印を付けました。パソコンがダークモードでも白い背景で表示します
- 「横幅いっぱい」のとき、縦長の動画で高さの上限も指定していると、プレイヤーの列ごと細くなって左右に余白が出ていたのを直しました
-
v0.5.1
- 「横幅いっぱい」のとき、縦長の動画（ショートを通常のプレイヤーで開いたときなど）のプレイヤーが縦に大きく伸びていたのを直しました
-
v0.5.0
- 右端のアイコン列（概要・コメントなどを開くボタン）を「関連動画の上に横一列」「表示しない」にできるようにしました
- プレイヤーを「横幅いっぱい」に広げる設定を加えました。横長のウィンドウや、関連動画の列を細くしたときに左右に出ていた余白がなくなります
- 設定画面を作り直しました。設定に合わせて動く再生ページの見取り図を置き、選択肢は図入りのボタン、数値はスライダーにしました
-
v0.4.0
- 右端のアイコン列が出ているアカウントで、関連動画がプレイヤーの下にグリッドで並ぶレイアウトを、以前のレイアウト（右に関連動画）に戻すようにしました
- 設定画面の「動作の確認」に、関連動画が実際にどこに表示されているかを加えました
-
v0.3.0
- 右に関連動画を出す最小のウィンドウ幅を、YouTube の既定の 1000px から 800px に下げました（設定で変えられます）
- 設定画面に「動作の確認」を加えました。直近の再生ページの状態を表示します
-
v0.2.0
- YouTube の新しい再生ページのレイアウト（関連動画がプレイヤーの下に並ぶ形）を使わず、以前のレイアウトで表示するようにしました
-
v0.1.0
- 最初の版です。プレイヤーの大きさ、関連動画の位置と見た目、コメント・概要欄の位置、タイトル・ボタンの周りを設定で変えられます