はてなブログに挿入したYouTube動画を指定時間からスタートさせる方法
思ったより苦戦したので自分用にメモ。
はてなブログ以外でも大丈夫だと思うけれど、他のサイトでは検証していないのではてなブログ用とした。
URLリンクだけなら簡単。
というエントリーに、YouTube動画を挿入した（実際には音声のみだけど）。
しかし、紹介したい部分は動画の最後の方にある。
そこで、開始位置を設定することにした。
YouTubeは動画の開始時間を簡単に指定出来る。
このように「共有」機能の「開始位置」にチェックして開始時間を指定してやれば自動でURLを作ってくれる。
今まで、メール等を使って友人に動画を紹介する時はこの方法で問題が無かった。
今回もこの方法でURLを貼り付ければ問題ないのだが、それでは素っ気ないと思った。
せっかくだから動画自体をブログに挿入しようと思ったのだ。
「埋め込みコード」機能を使う。
YouTubeには、外部サイト用に埋め込みコードを作ってくれる機能がある。
しかし、埋め込みコードには「共有」機能の時のような開始位置を指定するオプションが無い。
自分で直接書き込まなければならない。
そこで、YouTubeが作ってくれた
<iframe width="420" height="315" src="//www.youtube.com/embed/hSBYwZo0chs" frameborder="0" allowfullscreen></iframe>
に、共有の時使われていた「?t=12m26s」をのURL部分の最後に加えてみる。
<iframe width="420" height="315" src="//www.youtube.com/embed/hSBYwZo0chs?t=12m26s" frameborder="0" allowfullscreen></iframe>
あれ？結果はダメ。最初から再生されてしまう。
時間を秒数指定にしてみる。
<iframe width="420" height="315" src="//www.youtube.com/embed/hSBYwZo0chs?t=746s" frameborder="0" allowfullscreen></iframe>
やっぱりダメだ。
という事でここでやっとググる。遅いよー(^^;)。
YouTube 埋め込みプレーヤーとプレーヤーのパラメータ - YouTube — Google Developers
というのがあった。
startというパラメータを使えば良いらしい。
<iframe width="420" height="315" src="//www.youtube.com/embed/hSBYwZo0chs?start=746" frameborder="0" allowfullscreen></iframe>
としてみる。
できた！
ちなみに、startの値は正の整数と指定されていますので、12m26s等では無く、秒数で指定してください。
はてなブログには、管理画面に「YouTube貼り付け」というメニューがありますが、今回はYouTubeが提供しているタグを「HTML編集」画面に直接貼り付けて使いました。
人によって好みはあると思うけれど、こっちの方が簡単だと思ったもので。
