YouTube動画を埋め込む

YouTubeに公開されている動画を埋め込む方法

Saika avatar
対応者:Saika
一週間前以上前にアップデートされました

STUDIOでは、YouTube にアップロードした動画をEmbedボックスを使い、サイトに埋め込むことができます。Embedボックスの基本的な使い方については、こちらをご覧ください。

※現時点で、動画を直接アップロードする機能はございません

埋め込み手順

  1. エディタ左側の追加ボックス内、埋め込みメニューからYouTube動画のEmbedボックスを追加します

  2. 表示させたいYouTube動画のURL(例:https://www.youtube.com/watch?v=xxxx)をコピーします

  3. Embedボックスを選択したまま、設定パネルを開きコピーした動画のURLへ差し替えます

    ※ 「https://youtu.be/xxxx」形式のURL(動画そのもののURL)を入力しても埋め込みが上手くいきません。必ず、動画ページのアドレスバーから再生ページのURLをコピーしてください

自動&ループ再生させる

「動画URL」欄を使って簡易的に埋め込んだYouTube動画には、再生ボタンや再生バーが表示されます。

代表的なカスタマイズ例として、これらを非表示にし、動画を自動再生&自動ループさせる埋め込みコードの形式をご紹介します。(YouTubeロゴは消すことができません)

xxxxの部分2箇所を、埋め込みたい動画の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>

※mobile端末でのYouTube動画の自動再生は、YouTubeの仕様により制限されており、STUDIOでは実装できません。YouTubeの自動再生はデスクトップ端末のみに対応しております

video play mp4 mov

ビデオ ムービー

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