Vimeo動画を埋め込む

Vimeoに公開した動画を埋め込む方法

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

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

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

設定手順

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

  2. Embedボックスを選択したまま、設定パネルを開き、下記形式のVimeo再生ページのURLを入力します

    https://vimeo.com/xxxx

自動&ループ再生させる

代表的なカスタマイズ例として、動画を自動再生&ループ再生させる埋め込みコードの形式をご紹介します。

下記のコードの【ID】の部分を、埋め込みたい動画のID(URLのvimeo.com/xxxxの部分)に置き換えて、「埋め込みコード」欄に直接入力してご利用ください。

<iframe src="https://player.vimeo.com/video/【ID】?autoplay=1&loop=1&background=1"width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow=autoplay></iframe>

自動再生のパラメータが存在する場合、Vimeoのプレーヤーは自動的に再生を開始します。ただし一部のブラウザでは自動再生がブロックされることがあります。

上記コード内の [?background=1] パラメータは有料プランでのみ利用できます。有料プランをご利用でない場合は、こちらをご活用ください。

<iframe src="https://player.vimeo.com/video/【ID】?autoplay=1&loop=1&muted=1"width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow=autoplay></iframe>

注意点

  • メニューやバナーの非表示などの動画の設定をカスタマイズするには、有料プランをお使いいただく必要があります。

  • ツールメニューなどを非表示にして背景動画としてVimeo動画を埋め込むには、有料プランで利用できる [?background=1] パラメータが必要です。

関連記事

video play mp4 mov

ビデオ ムービー

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