◆とても簡単に使用できるイメージギャラリー「Flash Gallery」 [Blog News]

とても簡単に使用できるイメージギャラリー「Flash Gallery」
→エルエルが実際にアップロードしてみたサンプルページはこちら。
ええーと、先日わざわざガイジンさんがBBSに紹介に来てくれたので、自分で実際に使ってみるととても簡単だったのでご紹介です。
これはPHPとFLASHを使用した自分のサイトにアップロードするタイプのイメージギャラリーです。全て英語ですが、インストールの方はとても簡単です。
このアプリケーションはReality Softwareさんってサイトさんが作ったもので、もちろん利用は無料です。クリエイティブコモンズのライセンス下で配布されています。
まずはダウンロードページからソフトをダウンロードしましょう。
それを解凍すると以下のファイルが入っています。
flashgallery.html - デモ用のHTML
default.xml - ギャラリーの色などを登録するファイル
flashgallery.swf - 本体のFLASHファイル
flashgallery.php - PHPのスクリプト。(imgフォルダー内の画像をスキャンしたりするファイル)
swfobject.js - ギャラリー表示のためのジャバスクリプト
imgフォルダ - サンプル画像が入っています。
readme.htrml - 設置方法が書いてあるHTMLファイルです。
まずは「readme.html」を開くと説明が書いてあります。一瞬見ると難しいことが書いてありそうですが全然簡単です。
最初にとりあえず実際に自分のサーバーでもこのギャラリーが動くかどうか?ってのを確かめるために、解凍したファイルを任意のフォルダ(めんどくさい場合は解凍したままの「flashgallery」でいいかと)全部アップロードしてみましょう。このソフトを使用するにはPHPが使えるサーバーでなければなりません。
アップロードしたら「flashgallery.html」にアクセスしてみましょう。正常に画像が表示されていればOKです。
あとは特にアプリケーションの中身をイジる必要はありません。
このギャラリーを表示したいページに以下のソースを書き足します。エルエルのサンプルの様にギャラリーのみで使う場合は、元々入ってる「flashgallery.html」をリネームして使っても大丈夫です。
そのギャラリーを表示するページのソースの「head」内に以下の文章を足します。
<!-- Location of javascript. -->
<script language="javascript" type="text/javascript" src="swfobject.js" ></script >
そして「body」内のギャラリーを表示させたい場所に以下のソースを書きます。
<!-- Div that contains gallery. -->
<div id="gallery" align="center">
<h1>No flash player!</h1>
<p>It looks like you don't have flash player installed. <a href="http://www.macromedia.com/go/getflashplayer" >Click here</a> to go to Macromedia download page.</p>
</div>
<!-- Script that embeds gallery. -->
<script language="javascript" type="text/javascript">
var so = new SWFObject("flashgallery.swf", "gallery", "640", "480", "8"); // Location of swf file. You can change gallery width and height here (using pixels or percents).
so.addParam("quality", "high");
so.addParam("allowFullScreen", "true");
so.addVariable("content_path","img"); // Location of a folder with JPG and PNG files (relative to php script).
so.addVariable("color_path","default.xml"); // Location of xml file with settings.
so.addVariable("script_path","flashgallery.php"); // Location of php script.
so.write("gallery");
</script>
これでギャラリーが表示されます。
この中の「"640", "480", "8"」はギャラリーのサイズですので、この数字を変更するとデフォルトで表示される大きさを変更することも可能です。「8」ってのは下段に表示されるサムネイルの数ですネ。
最後に、ギャラリーを使ってるページのどこからに配布元のサイトの明記をします。
bodyタグ内にそのままコピーして貼り付ければOKです。
別に書かなくても使えますけど、なるべく書いてあげましょう。
<!--
Please place this link anywhere on the page that uses Flash Gallery.
You can style it anyway you want, but do not change or delete it.
Read the license! Thanks. :-)
-->
Powered by <a href="http://www.flash-gallery.org">Flash Gallery</a>
これで設置は完了です。
自分の画像を「imgフォルダー」にアップロードすれば、自動でギャラリーに表示されます。(アップロードした後に、一度オンライン上のギャラリーを閉じて、そして再び読み込んで下さい。)
デフォルトの状態ではギャラリーの大きさが「640×480」になってますので、それより大きな画像は縮小して表示されます。
左上にある「フルスクリーンモード」のボタンを押すと最大サイズでの表示が可能になります。
ギャラリーの画像は「ファイルネームの順番」で表示されますので、意図的に並ばせたい人は「1234...」みたいな感じのファイルネームにすれば並ばせることも可能です。
あと「default.xml」を開いて中の「色設定」を変えることにより、エルエルのサンプルページの様に画像のボーダー色などを変更することも可能です。
詳しくは「readme.html」を見るよろし。書いてあります。
簡単なので誰でも使えると思いますよ。
もしわかんなかったらエルエルに聞けば、わかる範囲だったらお答え出来るかと。
「あのクモは本物?」って質問のお答えは「もちろん」ですが。
●この記事のリンク(Permalink)
●トラックバック (0)