それぞれの入力項目は、下記のように設定してください。
【出力ディレクトリ】
HTMLファイルを出力するディレクトリ名を指定します。「はるてんボックス導入キット」を解凍してできたディレクトリツリーのトップである
tomica までのパスを指定します。
| 項目名 |
初期値 |
備考 |
| 出力ディレクトリ |
c:\ …
\html\tomica |
HTMLファイルを出力するディレクトリ。
参照ボタンを使うことが出来ます。 |
【サムネイル画像】
サムネイル画像の形式を指定します。画像形式は
gif 以外にも jpg や png
などを指定できます。拡張子や幅、高さを変更しても問題はありませんが、すべてのサムネイル画像で統一する必要があります。サムネイル画面には1行あたり4枚の画像が表示されます。
| 項目名 |
初期値 |
備考 |
| 拡張子 |
gif |
gif, jpg, png など |
| 幅 |
120 |
ピクセル数で指定します |
| 高さ |
90 |
ピクセル数で指定します |
【写真画像】
サムネイル画像をクリックした時に表示される大きいサイズの画像の形式を指定します。標準は
jpg ですが、jpg 以外に gif や png
を指定することもできます。拡張子や幅、高さを変更しても問題はありませんが、すべての写真画像で統一する必要があります。
| 項目名 |
初期値 |
備考 |
| 拡張子 |
jpg |
gif, jpg, png など |
| 幅 |
480 |
ピクセル数で指定します |
| 高さ |
360 |
ピクセル数で指定します |
【メニュー画面】
ブラウザ画面の左上のフレームに表示されるメニュー選択ページの属性を指定します。初期値ではアイコンは右向きの三角形になっています。相対パスで指定する場合は、はるてんボックス導入キットを解凍してできた
tomica
ディレクトリから見たパスを指定してください。
| 項目名 |
初期値 |
備考 |
| 背景色 |
#FFFFFF |
HTML方式の色で指定します |
| 文字色 |
#000000 |
HTML方式の色で指定します |
| LINK |
#0000FF |
HTML方式の色で指定します |
| VLINK |
#000080 |
HTML方式の色で指定します |
| ALINK |
#FF0000 |
HTML方式の色で指定します |
| HOVER |
#FF0000 |
HTML方式の色で指定します |
| アイコン |
icons/snkal10.gif |
項目の左側に表示されるアイコンのパス名 |
| 幅 |
10 |
ピクセル数で指定します |
| 高さ |
10 |
ピクセル数で指定します |
【選択画面】
ブラウザに表示される左下のフレームに表示されるページの属性を指定します。項目が階層構造になっている分類がありますので、アイコン1とアイコン2の両方を指定します。「一覧表」のときだけ、注意書きとしてビックリマークが使われていますが、このビックリマークのアイコンを指定することができます。
| 項目名 |
初期値 |
備考 |
| 背景色 |
#FFFFFF |
HTML方式の色で指定します |
| 文字色 |
#000000 |
HTML方式の色で指定します |
| LINK |
#000080 |
HTML方式の色で指定します |
| VLINK |
#0000FF |
HTML方式の色で指定します |
| ALINK |
#FF0000 |
HTML方式の色で指定します |
| HOVER |
#FF0000 |
HTML方式の色で指定します |
| アイコン1 |
icons/snkal09.gif |
分類名の左側に表示されるアイコンのパス名 |
| 幅 |
10 |
ピクセル数で指定します |
| 高さ |
10 |
ピクセル数で指定します |
| アイコン2 |
icons/snkal01.gif |
項目名の左側に表示されるアイコンのパス名 |
| 幅 |
10 |
ピクセル数で指定します |
| 高さ |
10 |
ピクセル数で指定します |
| 感嘆符 |
icons/minibang.gif |
注意書きのビックリマークアイコンのパス名 |
| 幅 |
10 |
ピクセル数で指定します |
| 高さ |
10 |
ピクセル数で指定します |
【サムネイル画面】
サムネイル画像が表示される画面の属性を指定します。写真を表示する場合は背景色は黒っぽい色のほうが良いといわれています。
ページ順に表示されるページで、前ページに進むアイコンと次ページに進むアイコンが使われます。
| 項目名 |
初期値 |
備考 |
| 背景色 |
#000000 |
HTML方式の色で指定します |
| 文字色 |
#FFFFFF |
HTML方式の色で指定します |
| LINK |
#FFFF00 |
HTML方式の色で指定します |
| VLINK |
#00FF00 |
HTML方式の色で指定します |
| ALINK |
#FF0000 |
HTML方式の色で指定します |
| HOVER |
#FF0000 |
HTML方式の色で指定します |
| タイトルの背景色 |
#0080C0 |
ページ上部のタイトル部の長方形の色 |
| 前ページ |
icons/snkar05.gif |
前ページに進むアイコン（左矢印）のパス名 |
| 幅 |
10 |
ピクセル数で指定します |
| 高さ |
10 |
ピクセル数で指定します |
| 次ページ |
icons/snkal05.gif |
次ページに進むアイコン（右矢印）のパス名 |
| 幅 |
10 |
ピクセル数で指定します |
| 高さ |
10 |
ピクセル数で指定します |
【写真画面】
サムネイルをクリックした時に表示される写真画像を表示する画面の属性を指定します。リンクが表示されないページなので、背景色と文字色だけを指定します。
撮影中を表わす画像と、未入手を表わす画像は、サムネイル画像と同じサイズのものを用意しておきます。（はるてんボックス導入キットの中にも入っています）
| 項目名 |
初期値 |
備考 |
| 背景色 |
#000000 |
HTML方式の色で指定します |
| 文字色 |
#FFFFFF |
HTML方式の色で指定します |
| NOW PRINTING |
icons/nowprinting.gif |
撮影中を表わす画像のパス名 |
| WANTED |
icons/wanted.gif |
未入手を表わす画像のパス名 |
【ホームディレクトリ】
各ページの最下行に設置される、トップページへのリンクに関する設定を行ないます。英語ページが用意されていない場合は英語版のURLを省略しても構いません。
| 項目名 |
初期値 |
備考 |
| URL |
/ |
トップページのURL |
| 英語版 |
/index_e.html |
英語版トップページのURL |
| アイコン |
icons/r_home.gif |
トップページアイコンのパス名 |
| 幅 |
90 |
ピクセル数で指定します |
| 高さ |
20 |
ピクセル数で指定します |
■トミカ登録
(1)最初にトミカの写真を撮影します。
写真の枚数は、1バリエーションにつき1枚あればサイトを構築することができます。写真の枚数を統一する必要はありませんが、1枚目のカットはトミカの角度や大きさを揃えたほうが良いと思います。
ちなみに私は、左前からのカットを
a、右後ろからのカットを b、正面からのカットを c、後面からのカットを
d、右側面を e、左側面を f、それから、箱と一緒に撮影したカットに
z をつけています。右の図は、a〜f
までの撮影方向を表わしたものです。もちろん、撮影方向をこれにあわせる必要はありません。
(2)写真画像をレタッチします。
デジカメで撮影した画像ファイルをそのまま使うときはレタッチする必要はありませんが、明るさやコントラストを調整したり、画像サイズを変更する必要があるときはレタッチします。
(3)データベースに登録します。
レタッチした画像のファイル名を決めるために、そのトミカの情報をデータベースに登録します。「はるてんボックス」を開き、「テーブル」の「MAIN」を開きます。
品番-世代番号-管理番号を決めて新しいレコードとして登録します。
例1)：0010101 … 1-1 ブルーバード No.1
例2)：0200838 … 20-8 スカイラインR34 No.38
| 項目名 |
内容 |
入力例 |
| ID |
品番-世代番号-管理番号を続けたもの |
0010101 |
| JUN |
サムネイル画面に表示される順番 |
10 |
| VAR |
森山リストのバリエーション番号 |
5（不明時は空欄） |
| TRADE |
※使われていません |
|
| NAME/名称 |
表示する名前 |
日産ブルーバード |
| ENAME |
英語版のとき表示する名前 |
DATSUN BLUEBIRD |
| COLOR/色 |
色名（任意入力） |
赤 |
| SCALE/縮尺 |
縮尺（任意入力） |
1/61 |
| MADEIN/製造国 |
製造国（任意入力） |
JAPAN |
| GNO/グループ |
種類別コード |
55 |
| MNO/実車のメーカー |
メーカーコード |
2 |
| CNO |
車名コード |
201 |
| TNO/車種 |
車種コード |
14 |
| PHOTO |
サムネイル画像の有無 |
（自動設定） |
| PHOTOS |
写真画像の存在状況 |
（自動設定） |
| PDATE |
撮影日(YYYYMMDD)ハイフン無し |
20040610 |
| BC |
所有数（赤箱中国製） |
1 |
| BJ |
所有数（赤箱日本製） |
0 |
| BK |
所有数（黒箱） |
0 |
| BB |
所有数（青箱） |
0 |
| BW |
所有数（オリジナル箱） |
0 |
| B0 |
所有数（箱なし） |
1 |
| PLACE |
購入情報（任意入力） |
20040301 ○○店 |
| PRICE |
購入価格（任意入力） |
\1200 |
(4)画像にファイル名をつけます。
「品番」「世代番号」「管理番号」「カット記号」からなるファイル名を画像につけます。カット番号は1がa、2がb、…という感じにアルファベットでつけます。ファイル名は、小文字でつけておきます。（サーバーによっては小文字に統一したほうが良いものがあります）
例1)：0200828a.jpg … 20-8 日産スカイライン(R34)
No.28 カット1
例2)：0010401a.jpg … 1-4
三菱ふそうエアロクイーン No.1 カット1
※WINDOWSのエクスプローラーでファイル名を変更するときは、ファイルを選択して
F2
キーを押すとファイル名を変更する状態になります。
(5)サムネイル画像を作ります。
サムネイル画像は、上記(3)でつけたファイル名のうちカット記号が「a」のものだけについて作成します。例：0010401a.gif
(6)画像ファイルを正式な場所に移します。
「はるてんボックス導入キット」の中には、画像を格納するためのフォルダが含まれていますので、このフォルダに写真画像とサムネイル画像を移します。
写真画像：tomica\photo\00〜s2
（品番の先頭2桁ごとに分ける）
サムネイル画像：tomica\thumb
■画像読み込み
(1)画像ファイルを読み込みます。
「はるてんボックス」の「フォーム」の「MAIN」を開き、「撮影情報更新」をクリックします。
プログラムが自動的に画像ファイルを読み込み、HTML出力の準備を行ないます。
■HTML出力
(1)HTMLファイルを出力します。
「はるてんボックス」の「フォーム」の「OUTPUT」を開きます。「出力開始」をクリックすると、HTMLファイルを出力します。
(2)サーバにアップロードします。
必要に応じてトップページを書き換え、HTMLファイルをサーバにアップロードします。アップロードするときは、「ホームページ転送」機能がついたFTPソフトを使用すると転送時間を短縮することができます。
■便利ツールのご紹介
はるてんボックスの他に、下記のようなソフトを使用することで効率よく作業を進めることができると思います。
◆ViX（フリーソフト）
http://homepage1.nifty.com/k_okada/
統合画像ビューアです。画像を表示するだけでなく、画像の管理やリサイズ等も行なえます。デジカメで撮影した画像からサムネイルを作成したり、データベースに登録したトミカの画像のリネームも行なえます。便利なツールです。
◆PicRen（フリーソフト）
http://www.vector.co.jp/soft/win95/art/se076141.html?g
元々はファイル名を連番でつけるためのソフトですが、画像にスタンプをつける機能があるため使用しています。多くのファイルに一括してスタンプをつけることができるので便利です。
◆NextFTP（シェアウェア \2,480）
http://www.toxsoft.com/nextftp/
HTMLファイルをサーバにアップロードするためのFTPソフトです。私は機能が豊富な点が気に入っているのですが、ホームページを転送するだけなら、もっとシンプルなソフトでも問題ないと思います。
