ホームページ作成SEOマニアックス

Flashムービー（ビデオ）をhtmlに埋め込む手順です。通常のembedタグだと文法上良くありませんので、script化して埋め込む方法になります。

• ホームページ作成SEOマニアックス
• 初級編
• 中級編
• 上級編
• お問い合わせ
• リンク集

wmv（WindowsMwdiaVideo）ファイル埋め込み（Java Script 編）と同じ要領で、ここではWebで汎用性の高いFlash（swf）の埋め込み手順を解説する。

最近ではflvが主流になってきたが手順は同じである。

なぜFLVやSWFのようなFlashがよく扱われるかというと、ほとんどのブラウザ、ほとんどのOSに対応できるというメリットがあるからである。

Flashなどのビデオファイルは、embedタグで記すのだが、embedタグは文法上よくないので、ここではscript化して読み込ませる方法を紹介します。

※2009/8/12追記

ここでの手順でSWFを埋め込みされた方は、SWFなどの埋め込みコンテンツがIE6でエラーダイアログが出る現象も合わせてご覧になって下さい。

ここでは、sample.swfというフラッシュムービーファイルを例にします。
sample.swfの置いてあるパスはこのページと同じです。

// sample.js
document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="320" height="240">');
document.write('<param name="movie" value="sample.swf">');
document.write('<param name="quality" value="high">');
document.write('<embed src="sample.swf" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="320" height="240"></embed>');
document.write('</object>');

このように書いてファイル名をsample.jsとしています。

ファイル名はご自分の好きなようにつけて、拡張子が.jsであればかまいません。

1行目の// sample.jsは、自分がわかり易いように書いてあります。
ここではsample.swfを使用しているので、jsファイルもsample.jsとしています。（ここは記載しなくても良いです）

2行目から4行目は、IE用にobjectタグを用いた部分になります。

2行目は縦横のサイズ、classid、codebaseが入ります。

3行目のparam name="movie"で、これはムービーファイルであることと、
同じく3行目のvalue="sample.swf"でFlash（.swf）ファイルのパスを入力します。

4行目のparam name="quality" value="high"は、画質の選択（例は高画質）

5行目はMozilla系のタグでsrc="sample.swf"にファイルのパス、quality="high"は画質（例は高画質）、
pluginspageはFlashPlayerのプラグインページ（現在はAdobeです）
type="application/x-shockwave-flash"はmimeタイプ、
そしてwidth="320" height="240"でビデオの縦横のサイズを入れます。

すべての記入が終わったら○○○.jsとして、任意のディレクトリにアップします。
例ではこのページと同じディレクトリにアップしてあります。

htmlのタグの記述は、作成したscriptを読み込むだけですので、Flash動画を貼り付けたい場所に

<script type="text/javascript" src="ample.js"></script>

と記述します。

前記したようにここでの例は、http://www.seo-maniax.com/high-rank/flashswfiemozilla/の中に、swf、jsファイルを格納してあります。

ご自分の環境に合わせて書き直してください。

ついでにWinIEでのアクティブコンテンツの警告を出さないようにするために

<!-- saved from url=(0022)http://your_site_domein.com -->

↑これをタグの中に書き込んで置くと良いと思います。
your_site_domein.comは、あなたのドメイン名と置き換えてください。

ちゃんとできていればこんな感じで表示されます
↓

この動画は、新潟にサワラのルアー釣りに行ったときの動画を編集したものです。
お暇な方は見てください（笑）

※2009/8/12追記

ここでの手順でSWFを埋め込みされた方は、SWFなどの埋め込みコンテンツがIE6でエラーダイアログが出る現象も合わせてご覧になって下さい。

ここの手順だけでは、IE6で警告ダイアログが出ます。（IE6のみの現象）

<<<前の記事へ | 次の記事へ>>> このページのトップへ

Copyright 2008-2009 ホームページ作成SEOマニアックス All Rights Reserved.