メインコンテンツにスキップ
すべてのコレクションよくある質問エディタ(デザイン)
YouTube 動画を自動再生やループ再生させたいです
YouTube 動画を自動再生やループ再生させたいです

埋め込みコードをカスタマイズして、YouTube動画を自動再生&ループ再生させる

Saika avatar
対応者:Saika
2か月以上前に更新

注意:音声付き動画の自動再生とブラウザ制限について

YouTubeやVimeoの動画を音声ありで自動再生する場合、ブラウザ側のポリシーによって制限されることがあります。

例えばChromeブラウザでは、音声付き自動再生には特定の条件が必要で、条件を満たさない場合は、コードに autoplay=1&muted=0 などのパラメータを付けても、音声は再生されません。

参照:

代替え案
ブラウザの制限をStudio側で回避することはできませんが、以下の2つの方法を検討できます。

  1. 音声なし(ミュート)で自動再生する

  2. 自動再生を設定せず、再生バーを表示して訪問者が手動で再生できるようにする

自動やループ再生の設定

YouTubeの動画を埋め込むコードは、パラメータを追加することでカスタマイズが可能です。(参照:サポートされるパラメータ | Google for Developers

以下のコードにおいて「xxxx」と記載されている部分を、埋め込みたい動画のID(URLにあるwatch?v=xxxxの部分)に置き換えて、動画を埋め込むためのコードとしてご利用ください。

<iframe width="560" height="315" src="<https://www.youtube.com/embed/xxxx?rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1&amp;loop=1&amp;playlist=xxxx&amp;mute=true>" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

なお、モバイルデバイスではYouTubeの動画の自動再生が制限されています。このため、ここで紹介するYouTubeの自動再生は、デスクトップデバイスのみに対応しています。

こちらの回答で解決しましたか?