• 会員サポートトップ
  • 各種お手続き
  • サーバ・メールの設定
  • マイページヘルプ
  • ブログへルプ
  • お問い合せ窓口

マイページヘルプ

会員サポート > マイページヘルプ > CGI設定 > メールフォーム(高機能版)

CGI設定 (メールフォーム高機能版)

メール送信フォームを利用開始するには

マイページにログイン後、ホームページスペースを選択し、右メニューの「オプション機能」-「有料CGI」を選択します。

メール送信フォームを利用開始するには

「高機能メールフォーム」-「利用開始」ボタンをクリックします。

メール送信フォームを利用開始するには

決済内容、規約を確認し、「規約に同意して申し込む」ボタンをクリックします。

決済画面に遷移します。
決済お手続が完了すると、メール送信機能を使用できるようになります。

フォームの作成方法

フォームのHTMLページを作成します。
※フォームの作成方法は、ご使用のアプリケーションソフトの説明書等をご参照ください。

フォームのactionにCGIを呼び出すパスを指定します。

<form method="POST" action="http://お客様サイトURL/cgi-bin/OPChargeCGI001/mail.cgi">

共有SSL使用の場合
<form method="POST" action="https://ssl01.smart-h.com/お客様スペース名/cgi-bin/OPChargeCGI001/mail.cgi">

お客様サイトURL:”スペース名.smart-h.com” 独自ドメイン使用の場合はwww.ドメイン名
※HTMLファイルからcgi-bin フォルダへの相対パスでの記述も可能です。

フォームの必須項目や入力チェックを設定します。

入力必須項目
フォームのnameに「_must」で終わる名前を付けます。例(name_must)

メールアドレス形式のチェック
フォームのnameに、入力用は eMail_must、確認用は _eMail_mustを指定します。
この両者が存在するときは、メールアドレスの妥当性チェックも行われます。

checkbox,初期値の無いradioボタンを必須にする場合
例 <input type="hidden" name="check_must" value="">
のようにhiddenタグにより空白値を送信してください。これが無いと、
何も選ばれなかったとき。必須のチェックが効きません。

その他の形式チェック
フォームのnameに以下で終わる名前をつけます。
_an :英数チェック
_anmust :英数必須チェック
_mail :mail形式チェック

画面作成例を見る
※ページのソースでご確認ください

CGI管理画面の設定

設定画面を開きます。

メール送信フォームを利用開始するには

管理者宛メールの設定

フォームから送信された内容を管理者に送信する、メールの設定を行ないます。

  1. 管理者宛メールのメールアドレス、タイトル設定を行ないます。

    メール送信先アドレス:フォームの内容を送信する管理者のメールアドレスを入力します。
    複数指定するときは「,(カンマ)」で区切ります。

    メール送信元アドレス :管理者に送信されるメールの差出人アドレスを入力します。
    メール配信でエラーが発生したときの返送先にも使われます。

    メール送信元名:差出人アドレスの名前を入力します。

    メールタイトル:管理者宛メールのタイトルを入力します。

  2. メール本文を設定します。

    メール本文 フォーマット
    ・定型フォーマットを使用…フォームの内容が自動的に挿入されます。
    ・お客様カスタマイズ…メール本文の内容をお客様にてレイアウトできます。

    メール本文カスタマイズ:上記で「お客様カスタマイズ」を選択した場合はメール本文を記述します。

フォーム要素を参照する場合は <* フォーム名 *>のように記述します。
例えば、<input type="text" name="address">の場合
住所 :<* address *>となります。

【記述例】
※メールヘッダーには、送信日時、IPアドレス、使用ブラウザが自動挿入されます。

webサイトより、お問い合せフォームの送信がありました。
---------------------------
お名前:<*name*>
メールアドレス:<*eMail*>
年齢:<*age*>
性別:<*sex*>
お問い合せ内容:<*message*>
---------------------------
以上

確認画面の設定

フォームの入力内容をプレビューする画面の設定を行ないます。

  1. 確認画面のフォーマットを選択します。
    定型(白バック 中央寄せ) :確認画面が自動生成されます。[デザインサンプル]
    定型(黒バック 中央寄せ) :確認画面が自動生成されます。[デザインサンプル]
    定型(白バック 左寄せ) :確認画面が自動生成されます。[デザインサンプル]
    定型(黒バック 左寄せ) :確認画面が自動生成されます。[デザインサンプル]
    お客様にてカスタマイズ:確認画面のHTMLをお客様が作成する場合に選択します。

  2. 上記で「お客様にてカスタマイズ」を選択した場合は、HTMLソースを記述します。
    ※<html></html>で囲まれた、ページのソース全てを入力してください。

フォーム要素の引用
<* と *> でformのnameを囲って指定するとformでnameの要素に入力された値が引用できます。
例)フォーム名"name"の場合:<* name *>

エラーメッセージの表示
必須チェックでの各要素のエラーメッセージは <* _falt_message_要素のNAME *>の形で引用できます。
エラーがない場合はエラーメッセージは空文字になります。
必須チェック、メールアドレスチェックの結果のエラーメッセージは <*_falt*>で引用します。
<*の後と、*>の前の空白は任意です。
例 <* name_must *> name_mustというNAMEで定義された要素の値
  <* _falt_message_name_must *> name_mustの入力値が空の場合のエラーメッセージ
  <* _falt *> 入力のチェックの結果のエラーメッセージ エラーが無い場合は空文字列

送信ボタンの表示
エラーがないときと、ある時のHTMLをそれぞれ下記の形式のように記述してください。
※行の頭に空白やタブが挿入されると動作しませんのでご注意ください。

〜〜共通のHTML
--_success--
<input type="submit" value="送信">
<input type="button" value="戻る" onClick="history.back()">
--_falt--
<font color="red"><* _falt *></font>
<br>
<input type="button" value="戻る" onClick="history.back()">
--_end--
〜〜共通のHTML

確認画面作成例を見る
※ページのソースでご確認ください

CGIのディレクトリ:デフォルトでは以下のようになります。
お客様サイトURL/cgi-bin/OPChargeCGI001/

画像へのパス: 絶対パス(http://〜)または、お客様サイトURL/cgi-bin/CGIディレクトリ/への相対パスで記述してください。

送信完了画面設定

送信完了後、移動するページのフォーマットを設定します。

  1. 送信完了画面フォーマット
    定型(白バック 中央寄せ) :定型の送信完了画面を使用します。[デザインサンプル]
    定型(黒バック 中央寄せ) :定型の送信完了画面を使用します。[デザインサンプル]
    定型(白バック 左寄せ) :定型の送信完了画面を使用します。[デザインサンプル]
    定型(黒バック 左寄せ) :定型の送信完了画面を使用します。[デザインサンプル]
    URL指定:送信完了のHTMLをお客様が作成する場合に選択します。

  2. 送信完了画面URL
    上記で「URL指定」を選択した場合は、URL(http://〜)を記述します。
    ※共有SSLを使用する場合は「URL指定」を選択し、お客様のサイトのトップページに戻るようにHTMLファイルを作成してください。定型フォーマットを使用すると、送信完了画面からのリンク先がスマートホスティングトップページとなります。

自動返信メール設定

入力されたメールアドレス宛に、フォームの送信内容を自動返信する設定を行ないます。
自動返信はフォーム名「eMail_must」に入力されたアドレス宛に送信されます。
必ずこの名前のフォームを設定するようにしてください。

  1. 自動返信メールを使用するかどうかを設定します。
    ・自動返信を行なう
    ・自動返信を行なわない

  2. 基本的な設定を行ないます。
    自動返信メール送信元アドレス:差出人アドレスとなる、管理者のアドレスを入力します。
    自動返信メール送信元名 :差出人アドレスの名前を入力します。
    自動返信メールタイトル :自動返信されるメールのタイトルを入力します。

  3. 自動返信メール本文を設定します。

フォーム要素を参照する場合は <* フォーム名 *>のように記述します。
例えば、<input type="text" name="address">の場合
住所 :<* address *>となります。

【記述例】
<*name_must*>様
お問い合わせいただきまして、 誠にありがとうございます。
スマートホスティング お客様窓口でございます。
ご記入いただきました内容は以下の通りです。
---------------------------
お名前:<*name_must*>
メールアドレス:<*eMail_must*>
年齢:<*age_num*>
性別:<*sex*>
ご希望のサービス:<*visit_must*>
お問い合せ内容:<*message_must*>
---------------------------
後程、担当者よりご回答差し上げますので、もうしばらくお待ちください。

@rt Form サンプル弊社デジタル素材オンラインショップにてフォームデザインテンプレートの販売も行なっております。ぜひご活用ください。

フォームデザインテンプレート[@rt Form]