YouTubeの動画をWebサイトやLPに埋め込みたい!
iframeでYouTube動画を埋め込んだ時の「自動再生」や「ループ再生」などのカスタマイズ方法をまとめました。
目次
埋め込み用のコードの取得方法
Youtube動画タイトル下にある「共有」→「埋め込む」をクリックするとiframeの埋め込みコードが表示されます。
それをコピーし、HTMLコード内に記入すれば動画がサイト内に表示されます。
カスタマイズ設定方法
取得したiframeのsrc属性に『https://www.youtube.com/embed/XXXXXXXXXXX』
のようなURLが指定されています。『XXXXXXXXXXX』の部分が動画の固有IDにあたります。
自動再生設定などのカスタマイズ設定をするには、URL末尾に?をつけてその後にパラメータを記入します。
例:https://www.youtube.com/embed/XXXXXXXXXXX?autoplay=1
【コピーOK】パラメーター一覧
ここでは、よく使うパラメーターを一覧で紹介します。
2つ以上パラメーターを設定する場合、&で連結させて記入してください。
スクロールできます
動作 | パラメーター | 備考 |
---|---|---|
自動再生 | autoplay=1&mute=1 | モバイル時での表示時は自動再生されない。 パソコン時でもミュートの設定必須。 |
動画を繰り返し再生 | loop=1&playlist=[ユニークID] | ユニークIDは動画URLの末尾 |
関連動画を非表示 | rel=0 | |
指定位置から動画を開始 | start=開始位置 | 時間は秒で指定 |
指定位置で動画を終了 | end=終了位置 | 時間は秒で指定 |
指定の区間だけ動画を表示 | start=開始位置&end=終了位置 | 時間は秒で指定 |
他のパラメーターは公式に掲載されてます!
他にも設定できるパラメーターはいろいろありますので、興味がある方は公式サイトをぜひ確認してください。
https://developers.google.com/youtube/player_parameters#Parameters