Web blog WEBブログ

サイトの埋め込み動画が自動再生されない場合の対応方法

2018.08.15

コーダーの兼山です。

最新版の Chromeなど、サイトに音声付き動画が埋め込まれている場合に、自動再生されなくなったブラウザがあります。

埋め込み動画について、自動再生(Auto)指定をしていても、
サイトの埋め込み動画が自動再生されない場合の対応方法をご紹介します。

iframe で Youtube 動画を埋め込んでいる場合

src に、“&mute=1” パラメータを追加します。
<iframe id=”Movie” name=”movie” title=”YouTube” src=”https://www.youtube.com/embed/(動画ID)&amp;showinfo=0&amp;rel=0&amp;modestbranding=1&mute=1&amp;wmode=transparent&(略)”></iframe>

videoタグで埋め込んでいる場合

video タグに、muted 属性を追加します。
<video muted src=”https://example.com/video/movie.mp4″ autoplay loop></video>

まとめ

今後、サイトへの埋め込み動画について、
自動再生に制限があるブラウザにも対応できるよう、事前に対策をしておくと良いと思います。

兼山暖美

この記事を書いた人 兼山 暖美 エンジニア

無料相談窓口