webdevqa.jp.net

埋め込み動画の「YouTubeで再生」オーバーレイを削除する

埋め込み時にビデオにオーバーレイされる「YouTubeで再生」ボタンを利用する方法はありますか?クロムレスyoutubeプレーヤーの使用を検討しましたが、オーバーレイを削除する方法がわかりませんでした。誰かがこれを行う方法を試したり聞いたりしたことがありますか?

11
Alexis

私が便利だと思った3つのパラメーターは次のとおりです。

showinfo=0
controls=0
autohide=1

showinfo=0は、ビデオのタイトルがビデオフレームの上部に表示されないようにします。 controls=0は、再生ボタンや音量などで下部バーを非表示にします。autohide=1は、コントロールにカーソルを合わせるまで非表示にします。これがおそらく最も便利です。

すべての公式ドキュメントは here です。

22
Lev

不可能だと思いました。したがって、再生ボタンを非表示にする唯一の方法は、以下のようにyoutubeから取得できるビデオの上にビデオ画像を配置することです。各YouTubeビデオには4つの生成画像があります。それらは予想通り次のようにフォーマットされます。

http://img.youtube.com/vi/<insert-youtube-video-id-here>/0.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/1.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/2.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/3.jpg

ただし、オーバーレイを追加したら、コントロールではなく画面をクリックしてもビデオは再生されません。これを行うには、ビデオを再生する次のjQueryを追加します

jQuery('#overlay').click(function(){
      jQuery(this).hide();
      jQuery('#youtube_id').get(0).playVideo();

});
15
Raghav Rach

最も投票された回答が今すぐうまくいきます! (15年9月9日(水))

  1. パラメーター &showinfo=0&controls=0&autohide=1ビデオのソースコードの直後
  2. src = "..."で改行なし

上記のケースはほとんど見逃していたと思います。

以下は私のサンプルコードです。

<div>
    <iframe id="bgVideo" width="800" height="480" frameborder="0" allowfullscreen
     src="//www.youtube.com/v/j-EQgzyoXMk&autoplay=1&loop=1&playlist=j-EQgzyoXMk&showinfo=0&controls=0&autohid=1">
    </iframe>
</div>

つまり...このようにしないでください

<iframe src="..." showinfo="0" controls="0" autohide="1" ...></iframe>`

またはこのように、

<iframe src="//www.youtube.com/v/...
             &autoplay=1
             &showinfo=0
             &controls=0
             &autohide=1
             &...></iframe>

と私の例の結果のスクリーンショット。

(評判のせいで画像を投稿できませんでした...こちらをご覧ください http://i.stack.imgur.com/zC5lz.jpg

忘れずに!

  1. パラメーター &showinfo=0&controls=0&autohide=1ビデオのソースコードの直後
  2. src = "..."で改行なし
3
Heedoo

YouTubeプレーヤーから再生ボタンを削除することはできません、そのための3つの回避策を聞いてください

1:ビデオの自動再生

2:ボタンがクリックされたときにプレーヤーの上にカスタムボタンが表示された独自のオーバーレイを追加し、JavaScriptを使用してビデオの再生と一時停止を処理する

3:動画コンテンツのURLを抽出します(YouTubeのポリシーに反しますが、機能し、将来いつか壊れる可能性があります)

埋め込みURL:

http://www.youtube.com/embed/VIDEO_ID?autoplay=1&showinfo=0&modestbranding=1&wmode=transparent&controls=1&color=white&rel=0&enablejsapi=1&playsinline=1&&version=3&theme=light&autohide=1&egm=0&showsearch=0&loop=1&playlist=VIDEO_ID"

HTML 5を使用している場合、上記のURLはビデオを自動再生します。デフォルトでは自動再生されません。そのため、JavaScriptを使用してビデオを自動再生する必要があります。

もう1つ:ビデオが終了すると、もう一度再生ボタンおよびビデオ情報が表示されます。私の知る限り、それは避けられません。

2
Nagaraj

2017回答:

右下隅の「YouTube」ロゴを参照している場合、これはinfoパラメータで削除できます。

showinfo=1

もちろん、これにより他の情報(ビデオのタイトルなど)も表示されるため、望ましくない場合があります。それでも、ロゴは非表示になっています! :)

0
rinogo

更新:

「modestbranding」プレーヤーパラメータを使用してみましたか? https://developers.google.com/youtube/player_parameters を参照してください

例: http://www.youtube.com/v/lT0ReYP3fDA?version=3&controls=0&modestbranding=1&showsearch=


「YouTubeで再生」オーバーレイを手動で削除すると、利用規約に違反します。

APIクライアントは、ユーザーまたは他の第三者に対して、YouTubeの検索結果またはその他の方法で提供されるYouTubeまたは第三者のWebサイトへのリンクの機能を変更、置換、またはその他の方法で無効にすることを奨励または作成しません。 YouTube APIまたはYouTubeプレーヤー。

十分に文書化されていませんが、とにかく利用規約に違反した場合、YouTubeがウェブサイトをブラックリストに載せることがあります。何が起こるかは基本的にすべてのビデオが105エラーコードを返し、動作を停止します。これは私が一度取り組んだサイトで起こり、ブラックリストを取り消すためにGoogleに連絡するのは簡単ではありませんでした(ToSに合わせて変更を加えた後)。

0
P. Galbraith

残念ながら、2015年8月19日にautohide属性が正式に廃止されました。適度な量のJavaScriptを使用しないと、再生ボタンを削除できなくなります。

同じことがここにあります https://developers.google.com/youtube/player_parameters#autohide

0
Srivats Shankar