このメールフォームを使うことで、あなたのホームページ上からメールを送信できるようになります。
作成例：注意点
作成例１：よくあるフォームの例
作成例２：表題を選択できるフォームの例
作成例３：アンケートフォームの例
※どうも、良く分からない・・・という場合は、作成例のHTML文をコピーして赤字の部分を自分用に変更して試してみてください。
実例１：ユーザ掲示板/チャットルーム募集フォーム
(実例なので、ソースを見るだけにしてください。決して送信テストはしないでください)
まず、下のHTMLを見てください。これは、メールを送信するために最低限必要な記述内容です。
| 赤字の部分は基本的に変更してはいけない部分です。 青時の部分はフォームフィールドのタイプで、目的に応じて変更することができます。 緑色の部分は各行の説明です 紫色の部分は、あなたのアカウントなどに必ず変更しなくてはいけない部分です。 黒字の部分は、変更できます |
| <form method="POST" action="/asp/mailto.asp"> | (1) | メール送信フォームの始まりです。メール送信プログラムの場所を定義しています |
| 宛先<input type="text" name="toaddr" size="50"><br> | (2) | 宛先の入力フィールドを定義しています |
| 送信元<input type="text" name="fromaddr" size="60"><br> | (3) | 送信元の入力フィールドを定義しています |
| 題名<input type="text" name="subject" size="78"><br> | (4) | 題名の入力フィールドを定義しています |
| 本文<textarea rows="4" name="body" cols="56"></textarea><br> | (5) | メール本文の入力フィールドを定義しています |
| <input type="submit" value="送信する"> | (6) | 送信ボタンを定義しています |
| <input type="hidden" name="nextpage" value="NEXTURL"> | (7) | メール送信後、表示したいページを定義しています（省略できます） |
| </form> | (8) | メール送信フォームの終了です |
上記のHTMLをそのままブラウザで表示させると以下のようなります。
各HTMLタグに関する説明は以下のとおりです。 |
|||||||||||
| (1),(8) | メール送信プログラムを明記したフォームタグ及びフォームの終了タグです ・メソッドには"POST"の指定をしてください ・アクションには、"/asp/mailto.asp"もしくは、"http://nas.ne.jp/asp/mailto.asp" を指定してください ・その他のフォーム属性は必要に応じて設定してください |
||||||||||
| (2),(3),(4),(5) | メールの内容をブラウザから入力させるためのフォームフィールドタグです
項目の順番は、どのような順番で定義してもかまいません。 |
||||||||||
| (6) | 送信ボタンのタグです。 | ||||||||||
| (7) | メールを送信した後に表示させたいページのURLを指定します。 カレントフォルダは無効となりますので、必ず絶対URLもしくは、NASのドキュメントルートからの相対URLで指定してください。 たとえば、あなたのアカウントが"abc"で、表示させたいページが"thanks.html"というファイル名で、あなたのルートドキュメントフォルダに置いてある場合は、 <input type="hidden" name="nextpage"
value="http://www.nas.ne.jp/usr/abc/thanks.html"> となります。 nextpageは省略可能ですが、省略された場合は、NASの標準メールフォーム受領ページが表示されます。
|
||||||||||
もっと色々やってみたい方に・・・
次のフォームフィールドを記述することが可能です
| name= | 内容 | |
| cc | カーボンコピーとして送信する送信先メールアドレスを指定するフィールドです。 ・メールアドレスを複数指定する場合はコロン（";"）で区切る必要があります。 |
|
|---|---|---|
| bcc | ブラインドカーボンコピーとして送信する送信先メールアドレスを指定するフィールドです。 ・メールアドレスを複数指定する場合はコロン（";"）で区切る必要があります。 |
|
| Importance | 電子メールの重要度を数値で指定します。 (0：低,1：通常,2：高)
|
|
| item1〜item20 | 主にアンケート用に利用できます。 各項目の入力内容は、メール本文の先頭に次の形式で挿入されます。
・項目名はitem1,item2,item3...と、最大item20
まで使えます。（使っていない項目は送信されません） |
| ご注意 | ・ | この例の送信ボタンは押しても動作しないようになっていますが、右のHTML文をコピーしてあなたのページで使用すれば、メールが送信されるようになります。 |
| ・ | 作成例のフォームには、あらかじめそれらしい文が入力例として入力されています。 右のHTML文をコピーしてあなたが作成したフォームページには表示されません。 | |
| ・ | HTML文の「赤字の部分」は、必ずあなたのアカウントやフォルダ名に変更してください。 | |
| ・ | getmonthメソッドでは月が０〜１１の数字で抜き出されるため、表示する際には月を入れておく変数に１を足さないと、正しい月が表示されなくなっています。 サンプルをご用意しましたので下記のように作成してみてください。 |
|
| サンプル | <head> <script language="JavaScript"> <!-- SysDate = new Date(); Year = SysDate.getYear(); Month = SysDate.getMonth(); Date = SysDate.getDate(); //--> </script> </head> <body> <script language="JavaScript"> <!-- document.write("本日は",Year,"年",Month+1,"月",Date,"日です"); //--> </script> </body> |
|
| ブラウザで表示されるフォーム | HTML文 |
|
このホームページのご意見をどうぞ |
このホームページのご意見をどうぞ<br> <form method="POST" action="/asp/mailto.asp"> <input type="hidden" name="toaddr" value="あなたのID@nas.ne.jp"> <input type="hidden" name="subject" value="■ホームページの意見"> あなたのメールアドレス <input type="text" name="fromaddr" size="56"><br> ご意見ご感想<br> <textarea rows="4" name="body" cols="59"></textarea><br> <input type="submit" value="このボタンを押して送信してください"> <input type="hidden" name="nextpage" value="/usr/あなたのID/thanks.html"> </form> |
| 送信後に表示されるページ | HTML文(ドキュメントルートに置いたthanks.html) |
|
ご意見ありがとうございます。 またのお越しをお待ちしております。 |
<html><head></head> ご意見ありがとうございます。<br> またのお越しをお待ちしております。<br> </body> |
| 解説 | |
|
よくあるご意見メールのフォームです。
このフォームでは、「宛先」と「題名」の入力項目がありません。通常は宛先はあなた自身のはずですから、隠しフィールドを使って、宛名を隠してしまっています。 <input type="hidden" name="toaddr" value="あなたのID@nas.ne.jp"> この行の「あなたのID」に、あなたのユーザIDを入れておけば、このフォームからはかならずあなた宛にメールが送られることになります。
同様に、「題名」も隠しフィールドにしてしまっています。 これは、あなたのメールボックスにメールが到着したときに、通常やりとりしている他のメールと見分けやすいように、ここから送られてくるメールの題名を固定で「■ホームページの意見」とするようにしたものです。 |
|
| ブラウザで表示されるフォーム | HTML文 |
|
私のホームページのご意見を聞かせてください |
私のホームページのご意見を聞かせてください<br> <form method="POST" action="/asp/mailto.asp"> <input type="hidden" name="toaddr" value="あなたのID@nas.ne.jp"> 内容はいかがでしたか？ <select size="1" name="subject"> <option value="■意見:とてもよかった">とてもよかった</option> <option value="■意見:まあまあだった">まあまあだった</option> <option value="■意見:とくに良くも悪くもない">とくに良くも悪くもない</option> <option value="■意見:あまりよくなかった">あまりよくなかった</option> <option value="■意見:全くよくなかった">全くよくなかった</option> </select>（選んでください）<br> <br> その他気が付いたことなどを教えてください<br> <textarea rows="4" name="body" cols="59"></textarea><br> あなたのメールアドレスをおしえてください<br> メールアドレス<input type="text" name="fromaddr" size="56"><br> <input type="submit" value="このボタンを押して送信してください"> <input type="hidden" name="nextpage" value="/usr/あなたのID/abc/thanks.html"> </form> |
| 送信後に表示されるページ | HTML文(abcフォルダに置いたthanks.html) |
|
貴重なご意見ありがとうございました。 2000年3月4日 1時46分8秒 ホームページに戻ります |
<html><head></head> <body> 貴重なご意見ありがとうございました。<br><br> <script language="JavaScript"> var dt=new Date(); document.write( dt.getYear() + "年" + dt.getMonth() + "月" + dt.getDate() + "日 " + dt.getHours() + "時" + dt.getMinutes() + "分" + dt.getSeconds() + "秒" ); </script> <a href="/usr/あなたのID">ホームページに戻ります</a> </body> |
| 解説 | |
|
今度は、意見をドロップダウンメニューから選べるフォームの例です。 「宛先」の入力項目は、前の例のようにあなた自身のメールアドレスを固定で指定しています。 「題名」の入力フィールドは、<select>タグを使って、いくつかの意見を選べるようにしています。 選択されるメニューに表示する内容は<option></option>タグで囲まれた部分、メール送信プログラムに表題として渡される文字列は、value=の中身となります。 この例も、あなたのメールボックスにメールが到着したときに、通常やりとりしている他のメールと見分けやすいように、ここから送られてくるメールの題名を固定で「■意見：」から始まるようにしたものです。 あなたのメールボックスには、 ■意見:とてもよかった ■意見:まあまあだった ■意見:とくに良くも悪くもない ■意見:あまりよくなかった ■意見:全くよくなかった などの題名で、メールが到着します。 送信後に表示されるページは、ドキュメントルートではなくて、"abc"というフォルダの下に置いてある設定となっています。 |
|
| ブラウザで表示されるフォーム | HTML文 | ||||||||
|
アンケートにお答えください |
アンケートにお答えください<br> <form method="POST" action="/asp/mailto.asp"> <input type="hidden" name="subject" value="■アンケートメール"> <input type="hidden" name="toaddr" value="あなたのID@nas.ne.jp"> 内容はいいかがでしたか？ <select size="1" name="item1"> <option value="内容:とてもよかった">とてもよかった</option> <option value="内容:まあまあだった" selected>まあまあだった</option> <option value="内容:とくに良くも悪くもない">とくに良くも悪くもない</option> <option value="内容:あまりよくなかった">あまりよくなかった</option> <option value="内容:全くよくなかった">全くよくなかった</option> </select><br> 色使いいかがでしたか？ <input type="radio" value="色：良い" checked name="item2">良い <input type="radio" name="item2" value="色：悪い">悪い<br> あなたの年齢 <select size="1" name="item3"> <option value="年齢：10代未満">10代未満</option> <option value="年齢：10代">10代</option> <option value="年齢：20代">20代</option> <option value="年齢：30代">30代</option> <option value="年齢：40代">40代</option> <option value="年齢：50代">50代</option> <option value="年齢：60歳以上">60歳以上</option> </select><br> あなたの性別 <input type="radio" name="item4" value="性別：男" checked>男 <input type="radio" name="item4" value="性別：女">女 <br> その他気が付いたことなどを教えてください<br> <textarea rows="4" name="body" cols="59"></textarea><br> あなたのメールアドレスをおしえてください<br> メールアドレス<input type="text" name="fromaddr" size="56"><br> <input type="submit" value="このボタンを押して送信してください"> <input type="hidden" name="nextpage" value="/usr/あなたのID/abc/thanks.html"> </form> | ||||||||
| 送信後に表示されるページ | HTML文(abcフォルダに置いたthanks.html) | ||||||||
|
ご協力ありがとうございました。 ホームページに戻ります |
<html><head></head> <body> ご協力ありがとうございました。<br><br> <a href="/usr/あなたのID">ホームページに戻ります</a> </body> |
||||||||
| 解説 | |||||||||
|
今度は、アンケートメールの例です。 ドロップダウンメニューやラジオボタン等を使って、アンケート入力項目を作成しています。 ポイントになる点は、必ず項目ごとに value= を使って、具体的な文字列を入れているところです。 たとえば、このアンケートフォームでは、次のようなメールが到着します。
いかがですか？ちょっとしたアンケートメールは、item番号項目をつかうことで作成できます。 |
|||||||||