予約システムのダウンロード「CARTMAKER」

完全無料のPHP版メールフォームのフリーポスト

フリーポストはHTMLページに入力ブロックを配置するだけで簡単に、お問い合わせページや資料請求ページなどを作成することができます。

メールフォーム

フリーポスト

フリーポストはお客様のサーバー内に設置して動作する無料のお問い合わせ・資料請求システムです。

サーバーへの設置

フリーポストをダウンロード後、お客様のサーバーの任意のディレクトリにアップロードしてください。

フォームの作成

お問い合わせ・資料請求などのフォーム内の入力項目は、氏名やメールアドレス以外にユーザー定義の入力項目を設置することができます。 フォームのデザインも自由にアレンジすることが可能です。
テキストボックスなどの入力項目の配置は入力ブロック内のコーディング方法をご確認ください。

フリーポストをダウンロード

フォームの作成

ユーザーがお問い合わせ・資料請求フォームなどで入力する各項目設定方法をご確認いただけます。

入力ブロックのidの一覧

id
説明
name_box
「氏名」の入力に利用します。
hurigana_box
「ふりがな」の入力に利用します。
mail_box
「メールアドレス」の入力に利用します。
optional_xx_box
optional_xx_boxはユーザー定義の入力項目です。
xx」には01から30までの数値を指定して、最大で30件までの入力項目を設定することができます。
ユーザーが定義することができる入力項目のIDはoptional_01_boxからoptional_30_boxまで。
subtitle_box
「件名」の入力に利用します。
body_box
「本文」の入力に利用します。

INPUT SELECT TEXTAREAの入力項目に設定する属性について

属性
説明
type
テキストの場合は「text」、ラジオボタン「radio」、チェックボックスの場合は、「checkbox」を指定してください。
name
typeで「radio」または「checkbox」を使用する場合に値を指定してください。
data-name
メール送信時に使用する入力項目名を指定します。
data-indispensable-item
任意入力の場合は0を、必須入力の場合は1を指定してください。
メールアドレスの入力などで誤入力を防止するため、再入力を求めて複数の入力項目の値が一致するかを確かめるには2を指定してください。

入力ブロック内のコーディング方法

								
名前

各タグのclass属性の値(クラス名)は全て必須となりますので上記のコードを参考にしてください。class属性の値(クラス名)は、オリジナルのクラス名を追加で定義することもできます。

  1. 1行目のdivタグのid属性には、上記の入力ブロックのidの一覧より用途にあった値を指定します。
    今回のサンプルでは氏名用のname_boxを指定と、class属性にはblockを指定してください。
  2. 2行目のspanタグ内のclass属性にはname_elementを指定してください。
  3. 3行目のspanタグ内のclass属性にはinput_elementを指定して、 spanタグ内の子要素(子タグ)として inputselectタグなどを配置します。
  4. 4行目のinputタグ内のdata-name属性に名前の指定と、 data-indispensable-itemの値には1を指定しています。
    data-indispensable-item属性の値を1とすることでこの入力は必須となります。

メールフォームのサンプルコード

								
MAIL FORM
必要事項を入力してください。
名前
ふりがな
メールアドレス 誤入力防止のためメールアドレスを再入力してください。
性別

複数回答


年齢
件名
メッセージ
  1. 1行目のdivのid属性にはmail_formが指定されています。
    mail_formを指定することでdiv内の子要素(子タグ)がメールフォーム内であることを指定しています。
  2. 3行目のspan内には任意のタイトルを記載してください。今回のサンプルコードでは「MAIL FORM」としています。
  3. 5行目のdivのid属性にはmail_form_for_messageが指定されています。
    ここにはフォーム上での注意事項などを記載してください。特記すべき情報がない場合でも、このdivは必ず配置するようにしてください。
  4. 9行から14行目は「氏名」用の必須項目のブロックとなり、9行目のdivタグのid要素にはname_boxを指定しています。 12行目のinputタグはdata-name属性に氏名、data-indispensable-item属性に1を指定しています。
    										
    名前
  5. 16行から21行目は「ふりがな」用の任意項目のブロックとなり、16行目のdivタグのid要素にはhurigana_boxを指定しています。 19行目のinputタグはdata-name属性にふりがな、data-indispensable-item属性に0を指定しています。
    										
    ふりがな
  6. 23行から30行目は「メールアドレス」用の誤入力防止のブロックとなり、 23行目のdivタグのid要素にはmail_boxを指定しています。 26行目と28行目にはinputタグの各data-name属性にメールアドレスの指定と、 各data-indispensable-item属性に2を指定しています。
    data-indispensable-item属性に対して2を指定することで、26行目と28行目のinputで入力したメールアドレスが一致するかを検証します。
    メールアドレスに対して誤入力防止の必要がない場合は、26行目のみのinputタグで利用することができます。
    										
    メールアドレス 誤入力防止のためメールアドレスを再入力してください。
  7. 32行から42行目の性別ブロックはユーザー定義の入力項目として32行目のdivタグのid要素にはoptional_01_boxを指定しています。 36行目と39行目はinputタグのtype属性にradioを指定しています。 inputタグの各name属性にsex、各data-name属性には性別と指定して、 36行目のvalue属性には男性、39行目には女性としています。
    										
    性別

  8. 44行から51行目の複数回答ブロックはユーザー定義の入力項目として44行目のdivタグのid要素にはoptional_02_boxを指定しています。 48行、51行、54行目はinputタグのtype属性にcheckbox、 name属性にresponse、data-name属性には複数回答と指定しています。 48行目のvalue属性には回答A、51行目には回答B、54行目には回答Cとしています。
    type属性のcheckboxを使用することで複数の項目を選択することができます。
    										
    複数回答


  9. 59行から71行目の年齢ブロックはユーザー定義の入力項目として44行目のdivタグのid要素にはoptional_03_boxを指定しています。 62行目のselectタグのdata-name属性に年齢と指定して、 63行から68行目までのoptionタグのvalue属性には年齢を指定しています。
    										
    年齢
  10. 73行から78行目は「お問い合わせのタイトル」のブロックとなり、 73行目のdivタグのid要素にはsubtitle_boxを指定と 76行目にあるinputタグのdata-name要素に件名、data-indispensable-item要素には必須項目の1を指定しています。
    										
    件名
  11. 80行から85行目は「お問い合わせの内容」のブロックとなり、 80行目のdivタグのid要素にはsubtitle_boxを指定と 83行目にあるtextareaタグのdata-name要素にメッセージ、data-indispensable-item要素には必須項目の1を指定しています。
    										
    メッセージ
  12. 87行から91行目は送信や戻るなどのアクションボタンの表示に関するボックスです。
    • 88行目のinputタグのid要素にはcheck_form_buttonは メールフォーム内で入力した「内容の確認ページ」へ移動する場合に表示されるボタンです。 value属性のデフォルト値は送信確認となっています。
    • 89行目のinputタグのid要素にはmail_send_buttonは 「内容の確認ページ」で表示される送信ボタンです。 value属性のデフォルト値は送信するとなっています。
    • 90行目のinputタグのid要素にはreturn_to_form_buttonは 「内容の確認ページ」から入力ページに戻るボタンです。 inputタグのvalue属性のデフォルト値は戻るとなっています。
    value属性の値は用途に合わせて変更してください。
    										

設定パネル

設定パネルのファイルは/free_post/control.phpとなりますのでブラウザよりアクセスしてください。

設定パネル
  • アカウント
    設定パネルでのログイン時のアカウント名となります。初期状態でのログイン時のアカウント名は「root」となります。
  • パスワード
    設定パネルでのログイン時のパスワードとなります。初期状態でのログイン時のアカウント名は「test」となります。
  • 受信メールアドレス
    フリーポストから送信されたメールを受信するメールアドレスを指定してください。
  • 送信メールアドレス
    フリーポストから送信されたメールの差出人のメールアドレスを指定してください。
  • 自動返信
    フリーポストから送信手続きが完了し際に自動返信メールを送信する場合は「有効」を選択してください。
  • 自動返信のタイトル
    自動返信メールのタイトルを入力してください。
  • 自動返信の本文
    自動返信メールの本文や署名を入力してください。