【WordPress】サイドバーに無音繰り返し動画を置くのは、本文内の動画ブロックのHTMLを、コピー&ペーストするだけ!!

 Vimeoの動画を無音繰り返し動画として利用する場合については、こちらのブログをご覧いただくとして、一般的な、WordPressフォルダ内の動画、Dropboxの動画など、URLにて呼び出せるものについては、サクッと簡単に、作ることが出来るので、ご紹介します。

以下のようになります。


<WordPressのサイドバーへ無音繰り返し動画を貼り付ける>
別ページで表示


以下は、サイドバー用無音繰り返し動画のソースコードのサンプルです。
下記のポイント解説の中に動画貼り付けがありますが、この動画ブロックを、HTML記述に変更してコピーしただけです。

<ソースコードサンプル>

<figure class="wp-block-video aligncenter"><video autoplay loop muted src="https://xxxxxxxx/xxxxx/xxxxx.mov" playsinline></video></figure>

これを、ウイジェットのカスタムHTMLへ、コピー&ペーストして、URLの部分だけを置き換えます。

ポイント解説

<1> 無音繰り返し動画を、本文の中で作ってみます。

ブロックから動画を選びます。本文では、右に表示されるバーから、再生の方法を細かく指定することが出来ます。自動再生、ループ、ミュート、インライン再生、をON、プレイバックコントロールだけをOFFにしてみると、上のように無音繰り返し動画になります。

<2> HTMLソースコードの取り出し方

貼り付けた動画をクリックすると、バーに点3つのマーク→HTMLとして編集、を選びます。

ソースコードが表示されます。これをコピーします。単にコピーするだけで何も変更しませんので、ご注意ください。

超簡単です!

以上です。