━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■SimpleViewerチュートリアル
━━━━━━━━━━━━━━━━━━━━━━━━━━━━
※ポイント
ギャラリーが表示される流れを分かりやすく言うと以下のようになると思います。

【ブラウザからのリクエスト】
▼
【index.html】　→　【swfobject.js】読み込み
ファイルが開かれて埋め込まれた｢viewer.swf｣を呼び出す
▼
【viewer.swf】
ギャラリーに表示させるための画像を探してくる
▼
【gallery.xml】
XMLで指定された情報を返す
↓
▼
【viewer.swf】
返ってきたXMLレスポンスを並べて表示する
▼
表示


────────────────────────────
まずサンプルをダウンロードしたものを解凍します。
何もいじらずにギャラリーを表示（index.html）してみましょう！
ギャラリーが無事に表示されれば環境テストはOKです！

次に、表示させたい写真や画像を用意します。
▼
【images】ディレクトリの中に表示させたい画像を入れます。
【thumbs】ディレクトリの中にサムネイルで表示させたい画像を入れます。
※ファイル名は統一しましょう！
（画像の内容は別物でも構いません）


画像の用意が出来たら【gallery.xml】に読み込ませるための記述を行います。


━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■XML編集
━━━━━━━━━━━━━━━━━━━━━━━━━━━━
XMLはブラウジングするのではなく、テキストエディタで開いて編集出来る状態にしましょう。
メモ帳やノートパッド、秀丸やTeraPadでOKです。

┌───────────────────────────
│gallery.xml
├───────────────────────────
↓
■<image>と言う箱の中に<filename>と<caption>という二つの箱が入っています。
■<filename>に画像のファイル名を格納します。
■<caption>に画像の情報を格納します（タイトルとか説明）。


┌───────────────────────────
│今回表示させたい画像だとします
├───────────────────────────
↓
pic001.gif
pic002.gif
pic003.gif


┌───────────────────────────
│記述例（普通にテキストエディタで編集して下さい）
├───────────────────────────
↓

<image>
	<filename>pic001.gif</filename>
	<caption>IMAGE : 1stCD.</caption>
</image>

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

↓
これでワンセットです。あとは必要な分増やして行きましょう！
↓

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

<image>
	<filename>pic001.gif</filename>
	<caption>IMAGE : 1st Album.</caption>
</image>
<image>
	<filename>pic002.gif</filename>
	<caption>IMAGE : 2nd Album.</caption>
</image>
<image>
	<filename>pic003.gif</filename>
	<caption>IMAGE : 3rd Album. Brand new album!</caption>
</image>


〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

↓
ここまで出来たら【gallery.xml】を上書き保存します。
そして【index.html】を開いてみましょう！
↓
上手く表示できましたか？
│
│
├【No!!】→下記参照
│
│
↓
【Yes!!】
おめでとうございます！
<image>要素を増やしてどんどん画像をアップしていけば
オリジナルギャラリーの完成です！


〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
※トラブルシューティング
├【images】ディレクトリと【thumbs】ディレクトリのファイル名は一致していますか？
├【gallery.xml】は編集後保存しましたか？
├【index.html】を更新（F5とか）しましたか？




━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■番外編
━━━━━━━━━━━━━━━━━━━━━━━━━━━━
┌───────────────────────────
│<caption>の中はタグもOKっぽいです！
├───────────────────────────
↓
タグを使う場合

<![CDATA[
これに括られた部分はXML上で通常の文字列として扱われます。
]]>

↓（例）

<caption><![CDATA[
<strong>IMAGE</strong> : <font color="#ffff00">It is my loved photograph!</font>
]]></caption>

〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜
※日本語はエンコードが必要なため文字化けします。


━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■あとがき
━━━━━━━━━━━━━━━━━━━━━━━━━━━━
どうでしょうか？
この解説が少しでも参考になって解決出来れば幸いです。

内容に不備がある場合、どうしても分からない場合はご質問下さい。
出来る限り対応させて頂きます。

より良いものが出来上がる事を願っております。

────────────────────────────
※この解説は、あくまで独自に解釈した内容です。
当方の動作環境では正常に作動しましたが、それを保証するものではありません。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━