YouTubeビデオの埋め込みはとても簡単です。 ビデオの下部にある共有オプションを使用すると、ビデオをWebサイトに埋め込むために必要なHTMLコードを取得できます。 YouTubeにはかなりの数の共有オプションがありますが、それらはすべてビデオを共有するためのものです。結局のところ、YouTubeが動画ホスティングWebサイトであることを考えると、これは理にかなっています。とはいえ、YouTubeのコンテンツの多くはプレーンオーディオです。多くのビデオはすべてオーディオであり、「ビデオ」の部分に入力する無関係な画像が含まれています。残念ながら、YouTubeでは動画の音声のみを共有または埋め込むことはできません。ビデオも含める必要があります。 YouTubeが提供する公式の共有オプションと埋め込みオプションを見逃したい場合は、動画の音声のみを埋め込む簡単な方法があります。解決策は、変更可能なコードの形でAmit Agarwalから提供されます。それは彼がGithubで利用可能にしたYouTube JavaScript APIに依存しています。仕組みは次のとおりです。
ステップ1： オーディオを埋め込む動画を見つけます。動画の「ID」をメモしてください。 IDは動画のURLの「v =」部分の後に表示され、下のスクリーンショットで強調表示されています。
ステップ2： 次のスニペットをウェブサイトのHTMLコードに追加し、「VIDEO_ID」の部分を前のステップでコピーした動画IDに置き換えます。
div data-video="VIDEO_ID" data-autoplay="0" data-loop="1" id="youtube-audio"> </div> <script src="https://www.youtube.com/iframe_api"></script> <script src="https://cdn.rawgit.com/labnol/files/master/yt.js"></script>
これは、本来あるべき姿です。
オーディオは自動的に再生されません。 再生を開始するには、再生ボタンをクリックする必要があります。コードにいくつかの変更を加えることで、自動的に再生し、ループさせることができます。自動的に再生するには、「data-autoplay」の値を1に設定します。オーディオをループで再生するには、「data-loop」を1に設定します。このコードを自分のWebサイトで使用する予定で、大量のトラフィックが予想されるため、独自のサーバーでスクリプトをホストするのが最善です。以下のリンクからスクリプトを取得できます。
デジタルインスピレーション経由
コメント