YouTubeのiframe埋め込み動画を自動再生する方法

 

ウェブページにYouTube動画をiframeで埋め込み、自動再生させる方法についてご紹介します。自動再生させるためには特定の条件が必要ですので、そちらも合わせて解説します。

目次

  1. 通常のiframe埋め込み方法

  2. 自動再生の条件

  3. 自動再生の設定方法

  4. パラメータの詳細

  5. ミュート設定なしでの自動再生？

  6. まとめ

通常のiframe埋め込み方法

埋め込みコードの取得

  1. 共有したい動画のページで、『共有』ボタンをクリックします。

  2. 共有方法を選択できるので『埋め込む』をクリックします。

  3. 表示されたiframeの埋め込みソースコードをコピーします。

通常の埋め込み例

以下のようなコードが表示されます。

<iframe width="560" height="315" src="https://www.youtube.com/watch?v=GL7_vQKL9fE&t=106s" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

こちらをページに貼り付けます。

自動再生の条件

YouTube動画を自動再生させるには以下の条件が必要です。

  • モバイル表示では自動再生されない

  • パソコン表示の場合でも、ミュート設定が必要

自動再生の設定方法

自動再生させるためには、iframeのsrc属性に以下のパラメータを追加します。

<iframe type="text/html" width="720" height="405" src="https://www.youtube.com/embed/GL7_vQKL9fE?autoplay=1&mute=1"></iframe>



パラメータの詳細



    
	
  1. 
	
    autoplay=1：自動再生を有効にします。
    2. 
	
  2. 
	
    mute=1：ミュート設定を有効にします。
    3. 




2つのパラメータは&で連結します。



ミュート設定なしでの自動再生？



ミュート設定なしで自動再生させるには・・・