アイコンを使用したスキンの作成
まず、次のようにアイコンを用意します。
icon001.gif | icon002.gif | icon003.gif |
《infoseekなどの場合》 (1例)
atom (自分のホームページ作成フォルダ)
|
└index.html (スキンボードを呼び出すトップページなど)
|
└cgi−bin このCGIを設置するフォルダ
|
├acclibf.cgi
│ 〜 (スキンボードの関連ファイル)
├sknbrdf.htm
│
├icon001.gif (アイコン1)
├icon002.gif (アイコン2)
└icon003.gif (アイコン3)
入力フォームでアイコンを選択させようとするとき、よく使われるのがセレクトメニュー(プルダウン形式)です。
そして、それを入力フォームで使用するときの記述例は、次のような方法があります。
変化する部分のみの記録 | ファイル名すべてを記録 | |
---|---|---|
入力フォーム での記述 |
<SELECT name="icon"> <OPTION value="#icsl001#">机</OPTION> <OPTION value="#icsl002#">電話</OPTION> <OPTION value="#icsl003#">パソコン</OPTION> </SELECT> |
<SELECT name="icon"> <OPTION value="#icslicon001.gif#">机</OPTION> <OPTION value="#icslicon002.gif#">電話</OPTION> <OPTION value="#icslicon003.gif#">パソコン</OPTION> </SELECT> |
ログ記録の内容 | 001、002、003 | icon001.gif、icon002.gif、icon003.gif |
表示部での記述 | <IMG src="icon#icon#.gif"> | <IMG src="#icon#"> |
変化する部分のみを記録したほうが、後で変更が出てきたとき簡単に修正できます。
ただし、将来的にアイコンを変更する予定がある場合は、「ファイル名すべてを記録」にした方が過去ログのアイコンが変わらずにすみます。
次に、次のようにアイコンだけが別フォルダにある場合の説明をします。
《infoseekなどの場合》 (1例)
atom (自分のホームページ作成フォルダ)
|
└index.html (スキンボードを呼び出すトップページなど)
|
├cgi−bin このCGIを設置するフォルダ
│ |
│ ├acclibf.cgi
│ │ 〜 (スキンボードの関連ファイル)
│ └sknbrdf.htm
│
└images アイコンがあるフォルダ
├icon001.gif (アイコン1)
├icon002.gif (アイコン2)
└icon003.gif (アイコン3)
変化する部分のみの記録 | ファイル名すべてを記録 | |
---|---|---|
入力フォーム での記述 |
<SELECT name="icon"> <OPTION value="#icsl001#">机</OPTION> <OPTION value="#icsl002#">電話</OPTION> <OPTION value="#icsl003#">パソコン</OPTION> </SELECT> |
<SELECT name="icon"> <OPTION value="#icsl../images/icon001.gif#">机</OPTION> <OPTION value="#icsl../images/icon002.gif#">電話</OPTION> <OPTION value="#icsl../images/icon003.gif#">パソコン</OPTION> </SELECT> |
ログ記録の内容 | 001、002、003 | ../images/icon001.gif、 ../images/icon002.gif、 ../images/icon003.gif |
表示部での記述 | <IMG src="../images/icon#icon#.gif"> | <IMG src="#icon#"> |
次に、アイコンのファイル名が番号でない場合の説明をします。
desk.gif | tel.gif | comp.gif |
《infoseekなどの場合》 (1例)
atom (自分のホームページ作成フォルダ)
|
└index.html (スキンボードを呼び出すトップページなど)
|
└cgi−bin このCGIを設置するフォルダ
|
├acclibf.cgi
│ 〜 (スキンボードの関連ファイル)
├sknbrdf.htm
│
├desk.gif (アイコン1)
├tel.gif (アイコン2)
└comp.gif (アイコン3)
変化する部分のみの記録 | ファイル名すべてを記録 | |
---|---|---|
入力フォーム での記述 |
<SELECT name="icon"> <OPTION value="#icsldesk#">机</OPTION> <OPTION value="#icsltel#">電話</OPTION> <OPTION value="#icslcomp#">パソコン</OPTION> </SELECT> |
<SELECT name="icon"> <OPTION value="#icsldesk.gif#">机</OPTION> <OPTION value="#icsltel.gif#">電話</OPTION> <OPTION value="#icslcomp.gif#">パソコン</OPTION> </SELECT> |
ログ記録の内容 | desk、tel、comp | desk.gif、tel.gif、comp.gif |
表示部での記述 | <IMG src="#icon#.gif"> | <IMG src="#icon#"> |
上記以外のご質問は、【ホームページ作成質問箱】でご質問ください。
スキンボードをご利用したご感想をぜひお寄せください。