映像制作 eラーニングのことならビズバレー
文字サイズの変更 標準 
大きい
ホーム > スタッフブログ
スタッフブログ
k.takahashi
k.taguchi
j.hashimoto
j.katou
y.hotate
m.kawai
s_inomata
m_muraoka
ビズバレーは、東京都 千代田区で活動する、映像制作、DVD、eラーニングを扱う会社です。

前回、Strobe Media Playbackのサンプルについている、setupを利用して、埋め込みコードを取得しましたが、objectタグを利用した方法でした。

YouTubeの埋め込みコードは、iframeをデフォルトにしているので、長いものに巻かれる感じで、今回は、iframeのケースを試してみようと思います。

やり方は、まず前回同様、Strobe Media Playbackをダウンロードして、「for Flash Player 10.1」を「StrobeMediaPlayback」にリネーム。そのままFTPでアップロードします。StrobeMediaPlaybackフォルダの1つ上に、動画を表示するHTMLファイルを置くようにします。

サンプルとして、埋め込みコードは、このような感じになります。

<iframe width="640" height="360" src="StrobeMediaPlayback/embed.html?src=https://bizvalley.co.jp/asset/01/bizvalley_pv.flv" class="strobemediaplayback-video-player" frameborder="0" allowfullscreen"></iframe>

ポイントは、embed.htmlにアクセスして、?src= で動画ファイルを指定している所です。動画形式は、flv、mp4どちらでもいけます。

src="StrobeMediaPlayback/embed.html?src=<動画ファイルURL>"

ブログに埋め込むと、このような感じになります。下の埋め込みは、相対パスでは繋がらないので、embed.htmlを絶対パスで指定しています。


Strobe Media Playbackでiframeを利用した埋め込み

サンプルデモ

いろいろなやり方があるので、必要なケースに応じて使い分けてみるといいでしょう。