秋月のHPは、Qponさん提供のフリーソース・・・高画質写真展示ツール
(Ver3)を自分なりにカスタマイズして作りました。
まずはそこの『ビルダーでの利用』をご一読ください。
<まず理解しておくこと>
1) これはJavaScriptで作られている。
2) スクリプトはQponさんのサイトの"quality3.js"に直リンクされ、
それで動いている。
3) 必要なのは画像(大小)とindex.html(htmでも可)だけ。
4) 画像のレイアウトは6列×4行で配列した。
(お気に入りを表示したまま見れる範囲で目一杯多く表示)
5) それをUPする自分専用のサイトがあること。
6) ビルダーは使わずに、今回はメモ帳のソースを変えて作る。
<作り方>
1
いつもHPを格納しておく場所(Dドライブあるいは
マイドキュメントなど)にフォルダを作る。名前は都合よく
付けてください。ここでは便宜的に「akiduki」とする。
2
私の秋月のHP →ここをクリック をみて、メニューバーの表示→ソース
でメモ帳が開く。
3
メモ帳のファイル→名前を付けて保存→保存した場所の
の「akiduki」フォルダを「開く」。
4
ファイル名を半角英数で 「index.html」(←メモ帳は拡張子まで
つける)で「保存」。
5
画像大は、600×450pxに縮小して、ファイル名を、001から024の
連番でつけ、 「akiduki」フォルダに保存。
同じ画像の小は、118×88pxに縮小して、ファイル名を、s001から
s024の連番でつけ、「akiduki」フォルダに保存。
【フォルダの中身】 クリックで拡大するとこうなっているはずです。
6
ここでindex.htmlを開くと、画像がご自分のに変わっていると
思います。
あとは【1】タイトル画像【2】タイトル下の説明、【3】拡大画像画面の
説明テキストの変更ですね。これはすべてソースでします。
7
【1】index.htmlの「表示」から「ソース」を開け、赤線の部分をご自分で
作ったタイトルgif画像にかえる。
テキストでいい方は、次のようなタグ(半角英数)に替える。 ↓
<font size="5" color="green">秋月ウォーク</blockquote>
<表示はこうなります→>秋月ウォーク
8
【2】続いて、同じく説明文もかえます。これは削除しても可。
その時は、<table>~</table>を削除。
9
【3】また続いて、拡大画像画面の説明文もかえます。
必ずテキストの部分だけを注意深く書き替えて下さい。
「,,や";」を削除すると表示されなくなります。
10
全部書き替わったら、「ファイル」→「上書き保存」。
11
ブラウザの更新をクリックし、出来上がりを確かめて完了!!
12
akidukiフォルダを、ビルダーのFTPあるいは
フリーソフトのFFFTPで自分のサイトにフォルダごとUPする。
13
インターネットエクスプローラーで確認。
無事表示できたら、拍手!!
URLは http://自分のドメイン名/akiduki/index.html
★一度苦労して作ると、2度目からは簡単ですよ~。
★勿論画像サイズは、大小とも希望のサイズに変えられます。