自分のページにお手製の Flash Movie (FLV) を貼り付ける方法
2007/01/07■2007/01/06 [Wiiで見られるYouTubeサイト「Wii-Tube」、だいぶイイ感じになってきました。
Wiiで見られるYouTubeサイト「Wii-Tube」、だいぶイイ感じになってきました。]
昨日の Wii-Tube の記事で、こんなコメントを頂きました。
投稿者 : 不破雷蔵 2007年01月08日 09:48
ところで記事に貼り付けてある動画、Youtubeとかじゃなくて直接サーバ内から
引っ張ってきてるみたいですけど、これって管理人さんが自ら動画ファイルを
Flash化したんすよね? どういうツール使うんですか? 気になるっす。
はい、おっしゃるとおりです。最近Wii-Tubeをガリガリ作っていることもあって、
今まで興味の無かった Flash Movie (FLV) 周りの情報が急激に
頭になだれ込んできています。これもそうした中の産物です。
ご自身でWebサイトを運営されている方、ブログオーナーなどもそうですが、
動画を貼り付けたいと思ったときに、「YouTube にアップしてから貼り付ける」
というやり方に違和感を感じる方も多いでしょう。権利云々はさて置くとしても、
「どう見ても 自分だけしか使わない 動画なのに、わざわざYouTubeなんて」
とか思ってYouTube側のリソースを気にしてあげたり、
「YouTubeの 混雑状況に左右されて 快適に再生できなかったりするし」
と、逆にYouTubeの環境を不満に思ったり、いずれにせよ、画像などは全部自分の
Web領域にアップしているのに、動画だけは他サービスと一蓮托生、というのは
何か腑に落ちない方も多いと思います。とすると、自分のWeb領域上で、
「ひとりYouTube」みたいなことができれば
問題は解決するワケです。もちろんYouTubeのように快適なUIを望むのは
無理ですが、自分で Flash Movie を作って、それを自分のページに
貼り付けるのはさほど難しくありません。手順はこんな感じです。
１、FLVファイルを作る
フリーのFLVファイル作成ソフトには 「Riva FLV Encoder 2.0」 があります。
■Riva - http://www.rivavx.com/
メニューの「Downloads」から「Free Riva FLV Encoder 2.0」の項を見ると、
ダウンロードは c-net の download.com から行うようになっています。
ジャンプした先のページで「Download Now」をクリックして保存し、
その RivaEncoderSetup.exe でインストールしましょう。
インストールが済んだら実際に Riva FLV Encoder 2.0 を起動します。
左側にInputファイル、Outputファイルを指定する欄があります。
「Browse」を押してエンコードしたいInputファイルを指定しましょう。
右側の「Video」という欄は、エンコード設定です。縦横サイズ、フレームレート、
ビットレートなどが指定できます。ブログなどで小さく貼り付けるのが目的なら、
縦横サイズは小さくしてしまっても構いません。同じビットレートであれば当然、
縦横サイズが小さいほうが画質は向上します。
私はビットレートをデフォルトの360Kbpsのままにして、縦横サイズをデフォルト
の640×480ではなく 320×240 指定にすることで画質を向上させています。
設定が済んだら「Encode」ボタンを押すとエンコードが始まります。
これでFLVファイルの作成は完了です。
２、FLVをページに貼り付ける
FLVファイルはあくまで Flash Movie データで、実際にページに貼り付けて
再生できるようにするには、FLASH型のプレイヤーがなければなりません。
そんなFLASH型のプレイヤーに 「FLASH VIDEO PLAYER 3.2」 があります。
■FLASH VIDEO PLAYER 3.2
http://www.jeroenwijering.com/?item=Flash_Video_Player
こちらにあるFLASH側のプレイヤーをダウンロードして使います。
flash_flv_player.zip というファイルにいろいろ詰まっていますが、
その中で使うのは flvplayer.swf というファイル1つだけです。
これを自分のWeb領域上のどこかに置いておきます。
そして先ほど作成したFLVファイルをこの flvplayer.swf で再生できるように
ページには object, embed タグを貼り付けていきます。こんな感じです。
□書き方
<object id=""(一意の識別子)" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="(横px)" height="(縦px)">
<param name="movie" value="(flvplayer.swfのパス)?file=(FLVファイルのパス)">
<param name="wmode" value="transparent">
<embed name="(一意の識別子)" src="(flvplayer.swfのパス)?file=(FLVファイルのパス)" width="(横px)" height="(縦px)" wmode="opaque" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed>
</object>
□貼り付け例
<object id="wiitube_refine" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="320" height="260">
<param name="movie" value="/flash/flvplayer.swf?file=/review/blog/temp/wiitube_refine.flv">
<param name="wmode" value="transparent">
<embed name="wiitube_refine" src="/flash/flvplayer.swf?file=/review/blog/temp/wiitube_refine.flv" width="320" height="260" wmode="opaque" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed>
</object>
これだけです、意外と簡単ですね ヽ(´ー`)ノ
プレイヤーがFLASH(swf)ですので、cgi領域すら使いません。
「ホームページサービス」を使っているだけの方でも普通に使えます。
使い方の一例として、
前回の記事でも示した「操作中の画面の公開」というのがあります。
■Wii-TubeをWiiから操作している画面
「○○を△△して次に××を・・・」といったような説明は、
文字よりも動画のほうがはるかにわかりやすいものです。
ほかにも、たとえば、こんなことをやってみましょう。
■我が家のワンちゃん動画
こんなのをブログにアップするだけのために、いきなりYouTubeにアップロード
というのも気が引けますが、自分のWeb領域であれば気になりません。
ほかにも、こんなのはどうでしょうか。
■「BLACK LAGOON」のDVDがオススメ！
CM動画というのは本来はグレー(というか黒)ですが、本編の販売を促進するような
貼り方であれば多少は甘めに見てもらえるかもしれません・・（もちろん本編の内容を
うかつに貼ったりすれば、それは相応のリスクを覚悟する必要があります）。
このように使い方は色々ですが、FLVファイルを自分で作って貼り付ければ、
YouTubeなどの外部サービスに頼らずに動画貼り付けをすることができます。
サイト作成に凝っている方はぜひいろいろ試してみてはいかがでしょうか。
2007/01/07 [updated : 2007/01/07 23:59]
ブログ「デジモノに埋もれる日々」「アニメレーダー」「コミックダッシュ！」管理人。デジモノ、アニメ、ゲーム等の雑多な情報をツイートします。
@ckom をフォローする
 « Wiiで見られるYouTubeサイト「Wii-Tube」、だいぶイイ感じになってきました。 |  トップに戻る |  成功は振り返って語るもの - 「PS3が圧勝した世界」という思考実験 » |
▼ はてなブックマークのコメント ▼
関連記事
ピックアップタグ
- アニメ(438)
- GSR(314)
- ライブ(77)
- イベント(203)
- コラボカフェ(35)
- VTuber(21)
- アニメ吐き出しメモ(10)
- ウマ娘(49)
- 舞台挨拶(45)
- 先行上映会(19)
- トークショー(20)
- バンドリ！(51)
- ガールズ＆パンツァー(59)
- 少女☆歌劇レヴュースタァライト(60)
- ゾンビランドサガ(9)
- プリンセス・プリンシパル(19)
- スタリラ(31)
- コラム(171)
- ゲームプレイ日記(69)
- ワンフェス(12)
- コメンタリー上映(7)
- 岩浪美和(25)
- 大洗(9)
- 響け！ユーフォニアム(12)
- リズと青い鳥(9)
- RAISE A SUILEN(10)
- 艦これ(23)
- ストライクウィッチーズ(23)
- メイドインアビス(8)
- BLAME!(8)
- ヤマノススメ(7)
- ラブライブ！サンシャイン!!(11)
- HELLO WORLD(6)
- 宇宙よりも遠い場所(5)
- ヴァイオレット・エヴァーガーデン(8)
- 私に天使が舞い降りた！(9)
ブログ内検索
▼ コメント ▼
No.6143 投稿者 : 不破雷蔵 2007年1月 8日 22:16
うほっ。いい記事。……というようなお茶らけた話じゃなくて。すっげー嬉しいです!ここ一年ほど「デジタルビデオカメラ買ったら色々やってみたいな。でもmovieファイルそのまま上げるの重たいよなYoutubeではflash化してアップしてるんだから個人ベースでもできないことないよなでもどうやるんだかわかんないなトホホ」と思ってた疑問が一挙に解決しました! ありがとうございますっ。これから時間はかかるでしょうけど(まず道具の調達だ＿|￣|○)少しずつ修練していくつもりです。
he.cgiの件といい、本当に助かります。ありがとうございました(ﾟ◇ﾟ)
No.6505 投稿者 : 不破雷蔵 2007年1月22日 21:57
……というわけでトラバにもあるように自分のところでも検証させていただきました。うまくできました(ﾟ◇ﾟ)ﾉ ありがとうございました★ あとは、Youtubeのように「静止画状態の時にブラック画面ではなくて動画中の一シーン(か任意の静止画)を入れることができないか」という問題ですね。これが可能なら、例えば「クリックして動画を見てくださいね」というメッセージも入れられるんですが(まぁキャプションテキストを掲載すればいいんですけど、それにしても黒画面はちょっと寂しい)。
No.6926 投稿者 : あちゃまる 2007年2月13日 11:40
ほんといい記事みつけましたー！
さっそく自分のＨＰに動画を載せて楽しんでます。
だけど・・・
ひとつ気になる点が・・・
.flvにした動画をサーバーにアップする２日後には消えてしまいます。
プレーヤーは残っていますが、アップした.flvのファイルだけ・・・
なんでなんでしょぅ？
毎回アップしなくちゃいけないのが面倒です。
知っておられる方いないでしょうか？
No.8032 投稿者 : さとしょー 2007年3月13日 16:09
ずばり知りたい事でした。
ありがとうございました。
No.8274 投稿者 : もくを 2007年3月18日 11:28
Riva FLV Encoderを使って自分のHPに↑のような動画を無事に設置できて、
もう一度やってみようとしたら、encoding failed と出てきて全然できませんでした。
動画の形式もいろいろ変えてやってみたのですが全く進展はありませんでした。
解決策を教えてください
お願いします。
No.8527 投稿者 : ｄ 2007年3月31日 10:58
(FLVファイルのパス)はどのように入力したらいいかわかりません
No.8528 投稿者 : ｄ 2007年3月31日 10:59
(FLVファイルのパス)はどのように入力したらいいかわかりません
No.8529 投稿者 : ｄ 2007年3月31日 11:04
場所はマイドキュメントにあります。
連投すいません
No.8584 投稿者 : あんこ 2007年4月 4日 13:49
前からやりたかったのですがやり方がイマイチわからず…。
このサイトを見てあっさりできました！
本当に助かりました、ありがとうございます
No.8649 投稿者 : ｂ 2007年4月 7日 15:16
Σ(ﾟДﾟ；ｴｰｯ!・・・・
わからないの俺だけ？
No.9287 投稿者 : くあ 2007年4月24日 11:00
>投稿者：ｂさん
flvplayer.swfのあるディレクトリからの相対パスのようですよ。
/home/myname/index.html
/home/myname/flvplayer.swf
/home/myname/movie/hoge001.flv
/home/myname/movie/hoge002.flv
このようなディレクトリで、index.html内で動画を使いたい場合は、
src="flvplayer.swf?file=movie/hoge001.flv"
という感じです。
No.12078 投稿者 : まにゅ 2007年7月19日 14:17
file= のところは URL でもいけました。
src="flvplayer.swf?file=http://hogehoge.com/movie/hoge001.flv"
みたいに。
No.17046 投稿者 : *ほお* 2007年12月 9日 17:17
付属のＪＳファイルとＪＰＧ画像を用意すると、黒画面も解消できましたよ。
No.17640 投稿者 : K 2008年1月10日 21:21
すばらしいっす！
参考にさせて頂きます(^0^)/
No.17912 投稿者 : ら 2008年2月10日 00:09
初心者です・・・。
flvplayer.swfがどこにあるのか分からないのですが、教えてください。
No.17913 投稿者 : ら 2008年2月10日 00:10
初心者です・・・。
flvplayer.swfがどこにあるのか分からないのですが、教えてください。
No.18013 投稿者 : p 2008年3月 2日 03:39
ら さん
http://wasabi01.hp.infoseek.co.jp/flash/index.html
コレをご参考に（どうやらファイル名が変わったようですよ。
No.19536 投稿者 : みとこん 2008年5月30日 11:31
参考にさせていただきました！ありがとうございます！！
コメントしましょう
コレなら出来そう。でも見せるようなコンテンツは無い。
メモメモ。ちょこっとやってみようかしらん。
.flvの作り方とCCライセンスのflvプレイヤー。
Riva FLV Encoder 2.0
FLVファイルを自作して自分のWebサイトで再生できるようにする手順。
flash movie
フリーソフトだけで実現する方法
オリジナルのタイトルに戻してみます。
Flashがなくても、フリーソフトだけでflvを作ってWebページ内に貼り付けられる。
FLASH VIDEO PLAYER 3.2 バージョンアップが続いてる･･･ ライセンスが気になるところ、CCはよくわからん。特に国別周り。
自分のページにお手製の Flash Movie (FLV) を貼り付ける方法:FLASH VIDEO PLAYERでFLVファイルを作って, FLASH VIDEO PLAYERでウェブページ上で再生
動画をFLV形式に変換、自分のサイトに掲載する方法。
YouTubeみたいなものを自分のWebサイトだけで実現する
これ行けそうじゃないですか！ついにRealともオサラバかな。
flvを作成してアップする
最近のトレンド、動画をYoutubeライクに貼り付ける／Winは大体行けるがMacOS9+IEはダメっぽい
早速試してみよっと。
.flvをWebサーバから配信
「Riva FLV Encoder 2.0」「FLASH VIDEO PLAYER 3.2」
しごと
ほほう
プレイヤーの紹介もあり。
ひとりyoutube作成tips
ひとりYouTube
自前のFLVファイルをブログやサイトに貼り付ける方法
サイト管理
FLVをhtmlに組み込む
コメントしましょう