ＨＯＭＥ
〜メニュー〜
▼始めに
▼作るための準備
▼記入項目を作る。
▼選択メニューを作る
▼ボタン式選択を作る
▼チェックボックスを作る。
▼複数行の入力項目をつくる。
▼では、実際に作ってみよう。
▼始めに
私が選んだメールレコーダサービスというのは、
FS-FORMというところです。
最初にここに行き、登録をしましょう。
登録の仕方は記入事項を入れて登録を押すだけです。
簡単なのですぐにできると思います
そして、時間がたったら確認のメールが
届き、ＩＤが書いてあると思うので
どこかにメモっておいてください。
ちなみに細かい設定などはここをみると良いと思います。
※あと、前回のバージョンでついていた転送後のＵＲＬ表示が無くなってるみたいです…
(前回のバージョンで書いたことの無い人は気にしないでください。)
▼作るための準備
では、作るための準備をしよう
まず最初に下のソースを書いてください。
|
<FORM ACTION="http://form3.future-s.com/cgi/form3.cgi" METHOD="post"> <INPUT TYPE="hidden" NAME="formid" VALUE="メールで送られてきたＩＤ"> <INPUT TYPE="hidden" NAME="formsubject" VALUE="題名"> ここの部分は、各自の設定 <INPUT TYPE="submit" VALUE="送信"> <INPUT TYPE="reset" VALUE="リセット"> </FORM> |
| ソースをコピーする |
題名とは、メールが届いたときの題名のことです。
送信したあとのページとは、最後に送信のボタンを押したあと、
普通は、FS-FORMの専用ページに飛ぶんですがこれを自分が作ったページに
とばせたい場合等に、設定してください。
別にいいやという人は、
ここを消しておいてください。
ここの部分は、各自の設定とかいてあるところは、
人の使い方によって、内容が違いますから
こういう風にかいてます。この部分の設定については
下からの説明を見てください。
※よくある間違いで「FORM」を「FROM」と書く人がいるので注意！
次にここの部分は、各自の設定とかいてある
ところの説明に入ります。ここが本題だと考えてもらっても
結構です。
これが最も基本です。名前の欄やメールアドレスの欄、
ＵＲＬの欄など、いろいろな用途があります。
まずは、名前の欄を作ってみましょう。
名前：<INPUT TYPE="text" NAME="名前" SIZE=20>
これで名前の欄ができます。
これだけでもメールフォームはできます。
|
<FORM ACTION="http://form3.future-s.com/cgi/form3.cgi" METHOD="post"> <INPUT TYPE="hidden" NAME="formid" VALUE="メールで送られてきたＩＤ"> <INPUT TYPE="hidden" NAME="formsubject" VALUE="題名"> <INPUT TYPE="hidden" NAME="formurl" VALUE="送信したあとに表示するページ"> 名前：<INPUT TYPE="text" NAME="名前" SIZE=20><br> <INPUT TYPE="submit" VALUE="送信"> <INPUT TYPE="reset" VALUE="リセット"> </FORM> |
| サンプル |
こういう物ができるはずです。
「NAME=」はメールが送られてきたときの
項目名ですからわかりやすい名前にしておきましょう。
このSIZE=数字というのは、記入するスペースの大きさを
表してます。
| サイズの違い |
この中から選んでくださいとかいう場合に
よく用いられる技法です。数は好きなだけできます。
下のように書きます
<SELECT NAME="選択肢の名前">
<OPTION VALUE="選択肢１" SELECTED>選択肢１
<OPTION VALUE="選択肢２">選択肢２
<OPTION VALUE="選択肢３">選択肢３
<OPTION VALUE="選択肢４">選択肢４
</SELECT>
これを書くと下のようになります。
| サンプル |
「SELECTED」は最初に選択されている項目につけておきます。
では、記入事項と選択肢を合わせた
メールフォームを作ってみましょう。
|
<FORM ACTION="http://form3.future-s.com/cgi/form3.cgi" METHOD="post"> <INPUT TYPE="hidden" NAME="formid" VALUE="メールで送られてきたＩＤ"> <INPUT TYPE="hidden" NAME="formsubject" VALUE="題名"> 名前：<INPUT TYPE="text" NAME="名前" SIZE=20><br> <p>あなたの使用機種： <SELECT NAME="使用機種"> <OPTION VALUE="ＤＣ">ＤＣ <OPTION VALUE="ＰＣ">ＰＣ <OPTION VALUE="ＤＣ＆ＰＣ">ＤＣ＆ＰＣ <OPTION VALUE="その他">その他 </SELECT> <br> <INPUT TYPE="submit" VALUE="送信"> <INPUT TYPE="reset" VALUE="リセット"> </FORM> |
| サンプル |
これも、上の選択メニューと似ていますが、
形状が違います。どんな物かというと
これのソースは
<INPUT TYPE=radio NAME="性別" VALUE="男" CHECKED>男
<INPUT TYPE=radio NAME="性別" VALUE="女">女
<INPUT TYPE=radio NAME="性別" VALUE="秘密">秘密
もちろん、フォームタグ(FORM)に挟まれていることが
前提とします。
「NAME=」はメールが送られてきたときの
項目名ですからわかりやすい名前にしておきましょう。
「VALUE=」はメールが送られてきたときに
選んだものがわかるような名前をいれておいてください。
「CHECKED」は最初にチェックがついてる項目につけておきます。
つけておかない場合は、いらないです。
ここでは、３つしか項目数を書いてませんが、何個でも
つくれます。
これはどんなものかというと
と、こんなやつです。
<INPUT TYPE TYPE=checkbox NAME="１チェック" CHECKED>チェックボタン１
<INPUT TYPE=checkbox NAME="２チェック">チェックボタン２
もちろん、フォームタグ(FORM)に挟まれていることが
前提とします。
「NAME=」はメールが送られてきたときに
チェックされた場合の名前ですのでチェックされたかわかるような名前に
しておいたほうがいいです。
「CHECKED」は最初にチェックがついてる項目につけておきます。
つけておかない場合は、いらないです。
これは、主に相手に要望、感想等を書かせるときに
つかわれるものです。
たとえば、こんなやつです。
もちろん、フォームタグ(FORM)に挟まれていることが
前提とします。
「NAME=」はメールが送られてきたときの
項目名ですからわかりやすい名前にしておきましょう。
「COLS」は入力項目の横のサイズです。
この数字が大きくなるほど横幅が広くなります。
「ROWS」は入力項目の縦のサイズです。
この数字が大きくなるほど縦幅が広くなります。
ここまでくれば、ほぼ大部分の機能は使えるようになって
いると思います。ここでは、私が今まで紹介してきた
タグなどを使って、メールフォームを作ってみますので
参考にしてくださいというコーナーです。
まずは、ソースはこちらです。
|
<FORM ACTION="http://form3.future-s.com/cgi/form3.cgi" METHOD="post"> <INPUT TYPE="hidden" NAME="formid" VALUE="送られてきたＩＤ"> <INPUT TYPE="hidden" NAME="formsubject" VALUE="メールフォームの感想"> お名前:<INPUT TYPE="text" NAME="お名前：" SIZE=20> <p>E-mail:<INPUT TYPE="text" NAME="E-mail：" SIZE=20> <p>ＵＲＬ:<INPUT TYPE="text" NAME="ＵＲＬ：" VALUE="http://" SIZE=30> <p>性別: <INPUT TYPE=radio NAME="性別" VALUE="男" CHECKED>男 <INPUT TYPE=radio NAME="性別" VALUE="女">女 <INPUT TYPE=radio NAME="性別" VALUE="秘密">秘密 <p> 使用機種: <SELECT NAME="使用機種:"> <OPTION VALUE="ＤＣ">ＤＣ <OPTION VALUE="ＰＣ">ＰＣ <OPTION VALUE="ＤＣ＆ＤＣ">ＤＣ＆ＤＣ <OPTION VALUE="その他">その他 </SELECT> <p>このページはわかりやすかったですか？<br> <SELECT NAME="わかりやすさ"> <OPTION VALUE="わかりやすい">わかりやすい <OPTION VALUE="まぁ、わかりやすい">まぁ、わかりやすい <OPTION VALUE="普通" SELECTED>普通 <OPTION VALUE="ちょっと、わかりにくい">ちょっと、わかりにくい <OPTION VALUE="わかりにくい">わかりにくい </SELECT> <p>インターネットの利用目的<br> <INPUT TYPE=checkbox NAME="趣味">趣味 <INPUT TYPE=checkbox NAME="仕事">仕事 <INPUT TYPE=checkbox NAME="学習">学習 <INPUT TYPE=checkbox NAME="その他">その他 <p>最後にこのページに関する感想を聞かせてください <TEXTAREA NAME="感想" COLS=40 ROWS=5><br> </TEXTAREA> <br><INPUT TYPE="submit" VALUE="送信"> <INPUT TYPE=reset VALUE="リセット"> </FORM> |
| ソースをコピーする |