SIRIUS(シリウス)でYoutube動画の指定した部分だけを再生させる方法

Tips_機能の拡張 Tips_プチ裏ワザ Tips_iPhone Tips_その他 購入者特典 購入者専用ページ

Youtube動画の指定した部分だけを再生させる

サンプル画像

 

動画をシリウスサイトに埋め込んで紹介するとき、
通常はすでにネットにアップされたYoutube動画をサイトに埋め込むパターンが
ほとんどかと思います。

 

この時、動画の尺(時間)が短かったらさほど気にすることもないんですが、
尺が長い場合は考えもんです。

 

見せたいYoutube動画にはゴミ映像も混じっていて実はそっちの方が長く、
実際に見せたい箇所は途中の1分間だけなんていうときですね。

 

しかたなく「○分○秒から見てください」と注意書きをしたところで
訪問者はそんなヒマぢゃぁありません。

 

だいたい指定した時間まで再生バーをドラッグするなんて面倒くさいことを
いちいちしてくれると思いますか?

 

よっぽど興味のあるテーマならまだしも、
そうでなかった場合は完全に放置プレー状態、、、というか
面倒くさくて見てもくれないでしょうね。

 

さてどうしましょ。

 

あ、こうしましょ、ということで

  • 指定した位置から再生させる
  • 指定した位置で再生終了させる
  • 指定した部分だけを再生させる
  • 指定した部分だけを再生させてなおかつ関連動画を再生させない

こういった機能を Youtube埋め込み動画に設定するやり方をご紹介します。

 

指定した位置から再生させる

例えば以下のような埋め込み動画用のコードがあったとします。

 

<iframe width="512" height="312" src="//www.youtube.com/embed/fOxX6SSQbHw" frameborder="0" allowfullscreen></iframe>

 

 

この埋め込み動画に「指定した位置から再生させる」機能を付け加えるには、
動画URLの最後に「?」と指定時間を表す「start=○○」を足してあげます。

 

たとえば1分4秒から再生させたいときは「?start=64」を加筆します。

 

<iframe width="512" height="312" src="https://www.youtube.com/embed/m4ehMg1y4j8?start=64" frameborder="0" allowfullscreen></iframe>

 

”64”という数字は秒数指定ですのでもしも3分3秒から再生させたいときは”183”になります。

 

こちら↓が設定済みの埋め込み動画です。
すでに再生バーが1分4秒まで進んることかと思います。

 

※音が出るよ

 

指定した位置で再生終了させる

これは上と反対に「?」「end=(再生を止めたい秒数)」で加筆します。

 

たとえば開始から1分20秒で再生を止めたいときは次のように書きます。

 

<iframe width="512" height="312" src="https://www.youtube.com/embed/m4ehMg1y4j8?end=80" frameborder="0" allowfullscreen></iframe>

 

指定した部分だけを再生させる

これは上記2つの合わせ技になります。
ただし書き方がちょっと異なります。

 

例えば1分4秒から1分9秒までの5秒間だけ再生させたい場合、次のようになります。

 

<iframe width="512" height="312" src="https://www.youtube.com/embed/m4ehMg1y4j8?start=64&end=69" frameborder="0" allowfullscreen></iframe>

 

「?」は最初だけで、複数のパラメータをつなぎ合わせていくときは「&」で連結します。

 

こちら↓がその設定例です。5秒間しか再生されません。

 

※音が出るよ

 

これまでの時間指定の方法には1点だけデメリットがあります。

再生終了後にもう一度見たいと思って再生ボタンをクリックしたり動画内のリロードボタンをクリックすると最初からの再生になってしまうことです。

この場合、ページをリロード(更新)すればいいだけなんですが、訪問者がそこまでやってくれるかどうか。

 

さて再生された方はお気づきでしょうが、
指定時間の再生終了後に関連動画が表示されてますよね。

 

そこで上記のコードに関連動画を表示させない設定(rel=0)も
さらに追加してみましょう。

 

追加方法は、、、もうなんとなくわかりますね。

 

<iframe width="512" height="312" src="//www.youtube.com/embed/fOxX6SSQbHw?start=64&end=69&rel=0" frameborder="0" allowfullscreen></iframe>

 

Youtubeの仕様が変わる可能性もあります。ここで書いた情報がいつまで有効なのかはわかりません。その点ご了承ください。

 

以上です。

 

購入ページへ


てっぺん