左サイドバー上部の検索欄に YouTube チャンネルの @ハンドル を入力して Enter を押すと追加できます。
@channelhandle または channelhandle（@ は自動補完）
追加したい YouTube チャンネルのページを開きます。
URL バーまたはチャンネル名の下に表示されている @ハンドル を確認します。
サイドバーの入力欄に @ハンドル を入力して Enter。
サーバーが YouTube からチャンネル情報を取得し、サイドバーに追加されます。
初回は直近15件の動画も同時に取得されます（数秒かかる場合があります）。
チャンネルを追加すると、YouTube の RSS フィードから直近 15 件の動画が自動的に取得されます。これはすべての基本機能を API キーなしで利用できる反面、過去の動画アーカイブは取得されないことを意味します。
YouTube Data API v3 のキーを登録することで、チャンネル追加時にすべての過去動画を一括取得できるようになります。
| 機能 | APIキーなし | APIキーあり |
|---|---|---|
| チャンネル追加・サムネ表示 | 動作する | 動作する |
| 2択投票・ランキング | 動作する | 動作する |
| 新着動画の自動取得（RSS） | 動作する | 動作する |
| 過去動画すべての取得 | 最新 15 件のみ（RSS制限） | YouTube Data API 経由で全件取得可能 |
| 視聴回数の表示 | 表示されない | 表示される |
| 動画の再生時間表示 | 表示されない | 表示される |
| ショート動画の自動分類精度 | RSS 情報のみ | contentDetails で正確に判定 |
Google Cloud Console を開き、Google アカウントでログインします。
画面上部のプロジェクト選択欄をクリックし、「新しいプロジェクト」 を作成します（既存のプロジェクトがあればそれを使っても構いません）。
プロジェクト名は任意（例: vote-thumbnail）。
左メニューから 「APIとサービス」→「ライブラリ」 を開きます。
検索欄に YouTube Data API v3 と入力し、表示された項目をクリックします。
API の詳細ページで 「有効にする」 ボタンをクリックします。
左メニューから 「APIとサービス」→「認証情報」 を開きます。
画面上部の 「認証情報を作成」→「APIキー」 をクリックします。
API キーが生成されます。表示されたキー（AIzaSy... で始まる文字列）をコピーして保存してください。
作成した API キーは、アプリの設定画面から登録できます。キーはブラウザ内にのみ保存され、他のデバイスやサーバーには共有されません。
画面左上のヘッダーにある歯車アイコン（設定ボタン）をクリックします。
設定モーダルの左サイドバーから 「APIキー」 タブを選択します。
入力欄に作成したキー（AIzaSy... で始まる39文字）を貼り付け、「保存」 をクリックします。形式が正しければ保存され、以後のチャンネル追加時に API が使用されます。
localStorage にのみ保存されます。別のブラウザやデバイスで使う場合はそれぞれのブラウザで入力してください。
API キーが漏洩した場合の被害を最小化するため、キーに制限をかけることを推奨します。
Google Cloud Console の 「認証情報」 ページで、作成した API キーをクリックして編集画面を開きます。
「API の制限」 セクションで「キーを制限」を選択し、「YouTube Data API v3」 のみにチェックを入れます。
本番環境では 「アプリケーションの制限」 で「HTTP リファラー」を選択し、https://vote-thumbnail.pages.dev/* を追加することも検討してください。
「保存」 をクリックして完了です。