本ドキュメントは、MicroEngine メールフォーム 0.2.X のインストール方法およびカスタマイズ方法について説明します。
最新版のマニュアルはこちらからお探しください。
/microengine-mf-0.2.0/ |-- contact/ | |-- me_mailform/ メールフォームディレクトリ | | |-- config/ 設定ファイルディレクトリ | | | |-- .htaccess アクセス制御ファイル | | | |-- body.txt メール本文 | | | |-- config.ini 設定ファイル | | | |-- item.ini フォーム項目設定ファイル | | | `-- responder_body.txt 自動応答メール本文 | | |-- log/ ログディレクトリ | | | `-- .htaccess アクセス制御ファイル | | |-- public/ 公開ディレクトリ | | | `-- captcha_image.php CAPTCHA画像スクリプト | | |-- script/ スクリプトディレクトリ | | | |-- kcaptcha/ CAPTCHAライブラリディレクトリ | | | |-- .htaccess アクセス制御ファイル | | | |-- Me_MailForm.php メールフォームスクリプト本体 | | | |-- qdmail.php メール送信ライブラリ | | | |-- qdsmtp.php メール送信ライブラリ | | | `-- simple_html_dom.php DOM操作ライブラリ | | `-- view/ テンプレートディレクトリ | | `-- error.html エラー画面テンプレート | |-- confirm.html 確認画面テンプレート | |-- entry.html 入力画面テンプレート | |-- index.php エントリースクリプト | `-- send.html 送信画面テンプレート |-- install.html `-- readme.html ※kcaptchaディレクトリ以下の表示は省略しています。 ※ログを書き出す設定の場合は、ログディレクトリ以下にファイルが書き出されます。
[mail] ;; ★★★ 必ず変更してください!!! ;; 送信元メールアドレス from = user@example.com ;; ★★★ 必ず変更してください!!! ;; 送信元表示名 ;; ここで指定した値が差出人の名前として表示されます。例: 山田 太郎 <user@example.com> from_name = "山田 太郎" ;; ★★★ 必ず変更してください!!! ;; 送信先メールアドレス ;; このメールフォームを受け取りたいメールアドレスを指定します to = info@microengine.jp
このメールフォームに含まれる画面テンプレートはサンプルです。 オリジナルのデザインを元にフォーム画面のHTMLを作成して使用することができます。
このチュートリアルを進めることで、オリジナルデザインのフォームの作成方法を学習できます。
この例では、サンプルフォームから次の項目を省略します。
<input type="submit" value="送信">エラーメッセージを表示するためのタグも移植します。
[flow] ;; 確認画面を使用する ;; この項目に 0 を指定するか、この項目をコメントアウトすると、確認画面を使用せずに、 ;; メールを送信します use_confirm = 0自動応答メールを省略するので、config.iniを編集します。
[mail] ;; ;; 省略 ;; ;; 自動応答メールのフォーム項目名 ;; フォームの項目名を指定すると、その項目の入力値を宛先としてメールを送信します ;responder_to = emailCAPTCHA(画像認証)を省略するために、item.ini 内の次の部分の先頭に ";"(セミコロン)を入力します。
;; 画像認証 ;[captcha] ;type = captcha ;label = "画像認証"※設定ファイル(config.ini及びitem.ini)の行頭に ";"(セミコロン)を入力すると、その行の設定を無効にできます。
例1の状態から、確認画面を追加する方法を説明します。
<tr> <th>お問い合わせ内容</th> <td id="comment"></td> </tr>※入力項目のNAMEに対応したID名を持つ要素内が、入力内容に置換される仕組みです。要素は、liやdivなどでもかまいません。
<input type="submit" value="確認画面へ">
[flow] ;; 確認画面を使用する ;; この項目に 0 を指定するか、この項目をコメントアウトすると、確認画面を使用せずに、 ;; メールを送信します use_confirm = 1
メール本文を変更する方法と、入力内容を置換するルールについて説明します。
■お問い合わせ内容 {comment}そうすると、メール送信時に "{comment}" というキーワードがフォームの入力に置換されます。
フォーム登録時の情報を差し込む方法を説明します。 例3と同様に body.txt を編集します。
フォーム登録時の日時、IP、ホスト、ユーザーエージェント をメール本文内に差し込みたい場合は、次のキーワードを body.txt に記入します。
日時:{_date} IP:{_ip} ホスト:{_host} ユーザーエージェント:{_ua}
※"{}" 波括弧で囲われた部分がフォーム登録時の情報を表すキーワードです。
フォームの入力項目を追加したり削除する方法について説明します。
item.ini という設定ファイルで、フォーム項目を定義します。
設定例:
;; お問い合わせ内容 [comment] type = textarea label = "お問い合わせ内容" required = 1 maxlength = 500
"[]"(角かっこ)内に指定した文字列が項目名になります。 上の例の場合、"comment" が項目名とります。 この項目名が、入力画面・確認画面・メール本文で利用される名前となります。
入力画面では、input要素やtextarea要素のNAME属性として指定します。
エラーメッセージを表示させたいHTML要素に、項目名+"_error" のID属性を指定します。 この場合は、"comment_error"というID属性を指定した要素内にエラーメッセージが表示されます。
<tr> <th>お問い合わせ内容<span style="color:red;">※</span></th> <td><textarea name="comment" cols="50" rows="10"></textarea> <div id="comment_error" style="color:red;">エラーメッセージ</div></td> </tr>
確認画面では、入力内容を表示させたい要素のID属性に"comment"を指定します。
<tr> <th>お問い合わせ内容</th> <td id="comment"></td> </tr>
メール本文では、body.txt内の"{comment}"という文字列を入力内容に置換します。
■お問い合わせ内容 {comment}
入力フォームのinput要素に対応したtype属性を指定します。 typeには、次の名前を指定できます。
<tr> <th>画像認証<span style="color:red;">※</span></th> <td> <img id="captcha_image" src="./me_mailform/public/captcha_image.php" width="160" height="80" title="画像認証"><br> 画像に表示されている文字を入力してください。<br> <input id="captcha" type="text" name="captcha"> <div id="captcha_error" style="color:red;">エラーメッセージ</div> </td> </tr>
項目の表示名を指定します。
エラーメッセージでは、"label"の値に置き換えることができます。
例えば、label = "お名前" を指定していた場合、エラーメッセージの設定文内の"{label}"が置換されて、「お名前を入力してください。」というようなエラーメッセージが表示されます。
※ エラーメッセージの設定は、config.ini内の[message]セクションで指定します。
※ label項目と、エラーメッセージの置換機能は、バージョン0.2.2で追加されました。
必須項目にしたい場合は "1" を指定します。
required = 1
最大文字数を指定したい場合は、文字数を指定します。
例:最大文字数を500文字に指定する
maxlength = 500
checkboxあるいは、selectタイプで複数要素を選択したい場合に "1" を指定します。
※ html側でもname属性に "[]" を付けるなどの対応が必要です。
※ バージョン0.2.1で追加された機能です。
multiple = 1
[foo] type = text label = "追加項目"
<tr> <th>追加項目<span style="color:red;">※</span></th> <td><input type="text" name="foo"> <div id="foo_error" style="color:red;">エラーメッセージ</div></td> </tr>
<tr> <th>追加項目</th> <td id="foo"></td> </tr>
■追加項目 {foo}
[foo] type = text label = "追加項目"
カスタマイズ例について説明します。
初期状態では、index.phpにブラウザでアクセスするとフォーム画面が表示されますが、このファイル名を変更することができます。
例えば、inquiry.php というファイル名でフォームを運用したい場合は、単にファイルをリネームするだけです。
それだけで、inquiry.php でフォームが動作します。
※entry.html, confirm.html, send.htmlもリネームできますが、その場合はconfig.iniの設定変更が必要です。
Webサーバー内のSendmailプログラムからではなく、他のメールサービスや自社のメールサーバーを経由してメールを送信する方法について説明します。
ここでは、Gmailを利用してメールを送信します。
※Gmailのメールアドレスは事前に取得しておいてください。
SMTP送信機能を利用するには、config.ini の [smtp]セクションに設定を追記します。
初期状態では、[smtp]セクション自体がコメントアウトされて無効になっています。
「認証なし」、「SMTP認証」、「POP Before SMTP」の認証方法の違いにより設定する項目が異なります。
ここでは、Gmailサービスを利用して、SMTP認証を設定する例を紹介します。
例:
;;;=========================== ;;; smtp セクション ※SMTP認証の設定例 ;;; SMTPサーバーを指定してメールを送信する場合に使用します。 [smtp] ;; SMTP_AUTH:SMTP認証 ;; プロトコル protocol = SMTP_AUTH ;; ホスト名 host = ssl://smtp.gmail.com ;; ポート番号 port = 465 ;; ユーザー名 user = memailform@gmail.com ;; パスワード password = yourpassword
※ユーザー名・パスワードはご自身のものを指定してください。
※利用サービスによってホスト名やポート番号の設定値が異なります。
SMTP送信機能を利用するメリットとして、スパムと判定されにくいということと、sendmailプログラムを持たないWebサーバーからでもメールを送信できるという利点があります。
同じname属性のcheckboxを複数用意する方法について説明します。
※ これは、バージョン0.2.1で追加された機能です。
入力画面(entry.html)では、name属性に "[]"(角カッコ)を付けます。
例:
<input type="checkbox" id="pamphlet0" name="pamphlet[]" value="会社案内を希望する"><label for="pamphlet0">会社案内を希望</label> <input type="checkbox" id="pamphlet1" name="pamphlet[]" value="商品案内を希望する"><label for="pamphlet1">商品案内を希望</label>
※ この例では、name属性に "pamphlet[]" と指定しています。
item.ini で該当項目のセクションにmultipleを指定します。
;; 資料請求 [pamphlet] type = checkbox label = "資料請求" multiple = 1
このように指定すると、確認画面やメール本文では選択された値を ", "(半角カンマ+半角スペース)で連結して表示します。
会社案内を希望する, 商品案内を希望する
複数項目選択時の連結文字列を変更するには、config.iniの[checkbox]セクションのdelimiter項目を変更します。
複数項目の連結に改行文字列を指定する例:
;;; checkbox セクション [checkbox] delimiter = " "
selectタイプ(プルダウンメニュー)で複数項目を選択する方法について説明します。
※ これは、バージョン0.2.1で追加された機能です。
入力画面(entry.html)では、name属性に "[]"(角カッコ)を付けます。
multiple="multiple" 属性も追加します。
例:
<select name="address[]" multiple="multiple">
※ この例では、name属性に "address[]" と指定しています。multiple属性も追加しています。
item.ini で該当項目のセクションにmultipleを指定します。
;; 都道府県 [address] type = select label = "都道府県" multiple = 1
このように指定すると、確認画面やメール本文では選択された値を ", "(半角カンマ+半角スペース)で連結して表示します。
栃木県, 東京都, 和歌山県
複数項目選択時の連結文字列を変更するには、config.iniの[select]セクションのdelimiter項目を変更します。
複数項目の連結に改行文字列を指定する例:
;;; select セクション [select] delimiter = " "
php 拡張子のテンプレートファイルを用意することで、テンプレート内でPHPを実行できます。
※ これは、バージョン0.2.1で追加された機能です。
拡張子がphp以外のテンプレートファイルでは、PHPスクリプトの記述があってもPHPは実行されません。
PHPを実行するためには、php拡張子のテンプレートファイルを用意すると同時に、config.iniの[step]セクションの設定を実際のファイル名に変更します。
;;; step セクション [step] ;; 入力画面で使用するテンプレートファイル entry = entry.php ;; 確認画面で使用するテンプレートファイルを指定 confirm = confirm.php ;; 送信画面(送信完了後)で使用するテンプレートファイルを指定 send = send.php ;; エラー用画面のテンプレートファイルを指定 error = me_mailform/view/error.php
これは、各テンプレートファイルの拡張子をphpに変更した例です。
※ index.phpと同じディレクトリにあればファイル名だけを指定します。
※ なお、テンプレートファイルは、viewディレクトリに移動すると直アクセスを禁止できます。(viewディレクトリは .htaccessの指定によりブラウザなどでアクセス出来ないようにしています。)
メール本文と同様にメールの件名を入力値で置換することができます。
管理者宛と自動応答メールの件名は、それぞれ config.ini の"subject"と"responder_subject"で指定します。
次のように "subject" に "{name}" のように波括弧で項目名を指定すると、その部分がフォームの入力値に置き換えられます。
;; 件名 subject = "{name}様からお問い合わせがありました"
※ 件名を置換できるタイプは "text, select, radio, checkbox, hidden, email" の6種類です。
※ 件名を置換する機能はバージョン0.2.2で追加されました。
フォームにemailタイプの項目がある場合、その入力値を管理者宛メールの送信元に指定できます。
次のように config.ini の from_item にemailタイプの項目名を指定します。
;; フォームの項目名を指定すると、その項目の入力値を送信元メールアドレスとしてメールを送信します from_item = email
このようにすると、メールの送信元がフォームの入力値になるため、届いたメールにそのまま返信できます。
送信元表示名も次のように項目名を指定すると、その入力値が表示名となってメールが送信されます。
;; フォームの項目名を指定すると、その項目の入力値を送信元表示名としてメールを送信します from_name_item = name
※ SMTP送信機能を利用した場合は、ここで指定した値が無効になる場合があります。
※ この機能はバージョン0.2.2で追加されました。
フォームの入力値が妥当でない場合に表示するエラーメッセージを変更できます。
config.ini の [message] セクションでエラーの種別毎にメッセージを指定できます。
例:
[message] ;; エラーメッセージID ;; 入力画面でエラー発生時にだけ表示したい見出しの要素名を指定します。 ;; エラーがない場合は、入力画面ではこのIDの要素を削除します。 error_message_id = error_message ;; 選択項目の未選択エラーメッセージ ;; selectタイプ、radioタイプの必須項目エラーが発生した場合のメッセージを指定します。 required_option = "{label}を選択してください。" ;; 入力項目の未選択エラーメッセージ ;; textタイプ、passwordタイプ、textareaタイプで必須項目エラーが発生した場合のメッセージを指定します。 required = "{label}を入力してください。" ;; 最大文字数エラーが発生した場合のメッセージを指定します。 maxlength = "{label}は{maxlength} 文字以内で入力してください。" ;; メールアドレス書式エラーが発生した場合のメッセージを指定します email = "正しい{label}を入力してください。" ;; CAPTCHA(画像認証)に失敗した場合のメッセージを指定します captcha = "{label}に失敗しました。" ;; リファラーエラー referer = "リファラーを確認できません。" ;; メール送信失敗 send = "メールの送信に失敗しました。"
このサンプルのように、{label} を指定するとその項目の表示名(item.iniのlabel項目)と置換できます。
※ label項目と、エラーメッセージの置換機能は、バージョン0.2.2で追加されました。