ココログでFlash画像を表示する方法
先日、試行錯誤してココログでフラッシュ画像を表示できるようになったので、自分用のメモを兼ねてまとめて見ました。
概略の流れ
（１）Flash表示に適したjpgデータを用意する。
（２）jpgデータをswfデータに変換する。
（３）swfデータをココログのサーバにアップロードする。
ここでは、画像のソースとしてCanon EOS Kiss Digital Xで約毎秒３コマで連続撮影して得たIMG_9592からIMG_9671までの80枚のjpg画像を使用しました。画像サイズは1936×1288、各画像の容量は約700KBです。
（１）Flash表示に適したjpgデータを用意する。
ココログで表示される画像の横方向のサイズは、自分のブログの場合には360画素で、デジタル一眼レフのアスペクト比が３：２ということなので、1936×1288を360×240に変換する必要があります。
画像サイズ変更用のソフトとしては、DigitalPhotoArts の木戸仁之さんの「Resize Version 1.0.1.1」（http://www.digitalphotoarts.com/software/resize/index.html）を利用させてもらいました。他にも変換ソフトは色々あるようですが試していません。
(1-1) 変換の対象となる全てのjpgデータを適当な名称（たとえば「リサイズ用」）をつけたフォルダに入れる。なお、後続のjpg→swf変換のために、jpgデータのファイル名は連番の必要があります（途中に欠番があっても変換はしてくれるようです）。この例では、IMG_9592, IMG_9593, IMG_9594,・・・・。なお、「IMG_」の部分は使用するカメラのメーカーや機種に依存して異なったものになると思います。
(1-2) Resize を起動する。
(1-3) 変換の対象となる全てのjpgデータを変換データ入力窓にdrag & dropする。
(1-4) 長辺のサイズを360とし、付加文字をブランクにする。なお、読み込みフォルダと書き込みフォルダが同じ場合は、付加文字をブランクにすると変換処理後は元データが上書きされて消えますので、元データが必要な場合は予めコピーをしておく必要があります。
(1-5) 「変換」ボタンを押す。
(1-6) 「リサイズ用」フォルダの中身を確認する。今回の例では、サイズが360×240に、容量が３～７KBになっていました。
（２）jpgデータをswfデータに変換する。
jpg→swf変換には、竹村伸太郎さんのMotionSWF（http://www.vector.co.jp/soft/win95/art/se226046.html）を使わせてもらいました。
(2-1) MotionSWFを起動する。
(2-2) 「リサイズ用」フォルダをフォルダごと入力窓にdrag & dropする。
(2-3) Fileの文字の下にあるSWF変換アイコンをクリックする。
(2-4) Convertのポップアップメニューが表示されるので、変換条件を設定する。
今回の場合は、Compress Type-Jpeg Compression, Color Quality 90, Frame Rate 3にしました。また、Output HTMLにはチェックを入れておきます。
(2-5) OKをクリックする。
(2-6)ファイル名が「IMG_」のHTML(IMG_.html)とShockwave Flash Object (IMG_.swf)が生成されていることをチェックし、IMG_.swfの容量が1MB以下であることを確認する。この例ではIMG_.swfのファイルサイズは381KBでした。1MBを越している場合には、写真の枚数を減らす、サイズを小さくする、画質を下げるなどの修正を行って、再度変換作業を行う。
(2-7) IMG_.htmlのファイルを開いて、PCローカルでFlash画像が表示されることを確認する。
（３）swfデータをココログのサーバにアップロードする。
(3-1) ココログログにインする。
(3-2) 「コントロールパネル」タブをクリックする。
(3-3) 「概要」タブをクリックして、アドレス(URL)を確認する。
今回の場合は、アドレスはhttp://xxxxxx.yyy-nifty.com/zzzzzzzzzzzzzzz/ とします。
(3-4) 「ファイル」タブをクリックして、ファイルマネージャーの画面を表示する。
(3-5) ファイル名がzzzzzzzzzzzzzzz となっているフォルダを開く。
(3-6) zzzzzzzzzzzzzzz のフォルダの中に、IMG_.swfと同じ名前のファイル名がないかどうか確認する。ここでは、同じファイル名がすでに存在していたものとします。この場合は、アップロードするべきデータのファイル名を変更する必要があります。
(3-7) 上記の（２）のステップで生成したIMG_.htmlとIMG_.swfをアップロード用に修正する。具体的には、既存データのファイル名と重複しないようにファイル名を変更するとともに、IMG_.htmlの内容をPCローカル表示用からサーバアップロード用に修正します。
(3-7-1) 「リサイズ用」フォルダの中にある IMG_.htmlのファイル名をIMG_2.htmlに変更する。（必須ではありませんが、ファイル名を変更したほうが、あとで対応がわかり易いので・・）
(3-7-2) IMG_2.htmlをメモ帳で開いて（「プログラムから開く」→「Notepad」）ソースを表示し、下記のように赤字部分を書き換える。
<html>
<body>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,0,0" width=360 height=240>
<param name=movie value="http://xxxxxx.yyy-nifty.com/zzzzzzzzzzzzzzz/IMG_2.swf">
<param name=quality value=high>
<embed src="http://xxxxxx.yyy-nifty.com/zzzzzzzzzzzzzzz/IMG_2.swf" quality=high width=360 height=240 type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash">
</embed>
</object>
</body>
</html>
(3-7-2)「リサイズ用」フォルダの中にある IMG_.swfのファイル名をIMG_2.swfに変更する。
(3-8) ファイルマネージャーで現在のフォルダが「ホーム/ zzzzzzzzzzzzzzz」であることを確認して、「新規ファイルのアップロード」枠からIMG_2.swfをアップロードする。
(3-9) 「コントロールパネル」から「ブログ」に移動し、ブログにIMG_2.htmlのソースを貼り付ける。
以上の操作で、ココログでFlash画像を表示することができるようになると思います。
無手勝流でやったので、おかしなところや無駄なところがあると思いますがご容赦願います。
| 固定リンク
「ウェブログ・ココログ関連」カテゴリの記事
- 練馬駐屯地からアクセス？(2017.04.06)
- ココログ、アップロード制限を1MBから3MBへ緩和予定(2017.04.03)
- RevolverMapsの"24 Hours"のデータ(2016.10.16)
- Cardboard カメラで撮ったVR画像をブログに埋め込んでみました(Roundme版)(2016.10.08)
- Nifty障害がやっと収束(2016.10.01)
コメント
はじめまして こんばんは(*ﾟ▽ﾟ)ﾉ
最近ココログをはじましたりらりらと申します。
ＳＵＺＵＫＡで簡単ＦＬＡＳＨアニメを作ったまではよかったのですが、ブログにアップできないのでへこんでいました。
丁寧な解説で私もＦＬＡＳＨアニメをココログにアップできました
本当に助かりました
ありがとうございましたm(__)m
投稿： りらりら | 2009年2月 1日 (日) 02時04分
りらりらさん
はじめまして。Kです。
コメントありがとうございます。
自分もいろいろ試行錯誤して表示できるようになったので、お役に立てばなによりです。
これからもよろしくお願いします。
投稿： K | 2009年2月 1日 (日) 17時50分