使い方
- YouTube 動画のリンクまたは11文字の ID を貼り付けます。
- 開始時間と終了時間、必要な再生オプションを設定します。
- レスポンシブまたは固定サイズを選び、内容が分かるタイトルを設定します。
- HTML をコピーして、ページまたはサイトビルダーの HTML ブロックに貼り付けます。「プレビューを表示」でテストできます。
仕組み
コードはYouTube標準のiframeプレーヤーを使用します。オプションはプレーヤーアドレスのURLパラメータになります。start / end（秒）、autoplay、mute、playlistによるループ、controls=0、字幕用のcc_load_policy=1、字幕言語用のcc_lang_pref、プレーヤー言語用のhlです。プライバシー強化モードではアドレスがyoutube-nocookie.comに切り替わります。
一部のオプションにはYouTubeまたはブラウザーによる制限があります。自動再生はミュート時のみ機能するため、ツールはautoplayとともにmute=1を追加します。1本の動画をループ再生するにはplaylistパラメータを同じ動画IDに設定する必要があるため、ツールが自動で追加します。字幕は動画に字幕がある場合のみ表示されます。埋め込みを無効にしている動画は、プレーヤーにエラーが表示されます。
レスポンシブモードでは、iframeを aspect-ratio: 16 / 9 と width: 100% のボックスで囲むため、従来のpadding-bottomによる手法を使わずにページに合わせて拡大縮小します。固定モードではwidth属性とheight属性を書き出します。遅延読み込みは、プレーヤーがページの表示領域に近づくまで読み込みを遅らせます。
使用例
プライバシーに配慮したレスポンシブ埋め込み
デフォルト設定: youtube-nocookie.com、レスポンシブ16:9、遅延読み込み。スニペットを任意のHTMLページに貼り付けてください。
背景動画風ループ
自動再生、ループ、コントロール非表示にすると、…/embed/ID?autoplay=1&mute=1&loop=1&playlist=ID&controls=0 のようになります。
指定した区間だけ再生
1:00 で開始し 2:30 で停止する場合は start=60&end=150 となり、プレーヤーはその部分だけを再生します。
よくある質問
埋め込んだ動画が音声付きで自動再生されないのはなぜですか？
ブラウザは音声付きの自動再生をブロックします。自動再生には mute=1 が必要で、このツールが自動的に追加しますが、一部のブラウザや設定ではそれでもブロックされることがあります。
プライバシー強化モードでは何が行われますか？
プレーヤーは youtube-nocookie.com から読み込まれます。YouTube によると、動画を再生しない限り、訪問者に関する情報はパーソナライズ目的で保存されません。
ループ再生に playlist= が必要なのはなぜですか？
YouTube の loop パラメータはプレイリストと一緒に使う場合のみ機能します。playlist に同じ動画 ID を設定すると、1本の動画を繰り返し再生できます。
生成されたコードは WordPress で動作しますか？
はい。カスタム HTML ブロックに貼り付けてください。一部のサイトビルダーはセキュリティ上の理由で iframe を削除するため、その場合は各ビルダー独自の動画ブロックを使用してください。
プライバシー
埋め込みコードはブラウザ内で生成され、どこにも送信されません。「プレビューを表示」をクリックした場合にのみ、ブラウザが YouTube（または youtube-nocookie.com）からプレーヤーを読み込みます。