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. mute=1：ミュート設定を有効にします。

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

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

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

YouTubeのiframe埋め込み動画を自動再生する方法 | EGUWEB(エグウェブ)YouTubeのiframe埋め込み動画を自動再生する方法