旧サイトでは総てが始めて試みだったので、メール機能に「Contact Form 7」プラグインを利用していました。
しかしWordPressの色々な事が判ってくると、メール送信は下記のWordPress関数で送れる事が判りました。
wp_mail($to,$subject,$message,$headers)
そこで「Contact Form 7」をカスタマイズして使うより、独自のフォームで作成した方が良いとの判断から独自のメール送信プログラムを作成しました。
但し、WordPressサーバにSMTPサーバが無い場合はSMTPのプラグインがが必要になります。
詳細は[WordPressから[WP SMTP]プラグインを利用してメールを送る方法]を参照してください。
1.メール送信プログラムの基本構造
1-1.メールプログラムの構成
メール送信プログラムは下記の5つのプログラムから構成されています。
プログラム | 概要 | |
1 | main.php | 固定ページから呼ばれるテンプレートで下記プログラムをCALLします |
2 | input.php | データを入力する画面 |
3 | check.php | 入力データの不具合をチェックするプログラム |
4 | confirm.php | 最終確認画面 |
5 | sedmail.php | メールを送信するプログラム |
※1.上記プログラムは子テーマの中に「contact」フォルダを新規作成しこの中に作成しています。
1-2.固定ページの作成
新規に「お問い合わせ」ページを作成し、利用するテンプレートで上記の「main.php」のテンプレート名を指定しています。
1-3.各プログラム間でのデータの受け渡しについて
データの受け渡しはWordPressのセッション機能で受け渡します。
よってセッション機能をまだONにしてない場合は下記のファンクションを定義してください。
//$_SESSIONを使える様にする function init_sessions(){ if(!session_id()) {session_start();} } add_action('init', 'init_sessions');
※1.セッション機能の詳細については画面サイズを取得する方法を参照してください。
2.具体的なプログラムと解説
下記のタブの中で各プログラムの機能を解説しています。
- main.php
- input.php
- check.php
- confirm.php
- sedmail.php
main.phpのプログラムは下記になります。
<?php /******************************* 固定ページ お問い合わせ Template Name:contact *******************************/ ?> <?php get_header(); ?> <?php // 不正アクセスフラグ $noindexaccess = true; /*-------------------------*/ /* 全体のコントロール */ /*-------------------------*/ switch($_POST["action"]): // メール送信処理と完了画面を表示 case "sendmail": include('sendmail.php'); break; // エラーチェック&確認画面表示 case "confirm": include('check.php'); if($error_flg !== 0): include('input.php'); else: include('confirm.php'); endif; break; // 新規入力画面を表示 default: include('input.php'); endswitch; ?> <?php get_footer();?>
※1.不正アクセスフラグは各プログラムがこのメインルーチン以外から実行された場合に処理中断させるフラグです。
※2.$_POST[“action”]にセットされている名前で次に実行するプログラムを指定しています。
※3.始めは上記に何もセットされてないのでdefaultのinput.phpが実行されます。
メモ
各プログラムは「contact」フォルダの中にあります。
そこで固定ページのURLを実行すると「contact」フォルダの中のmain.phpが実行されます。
このプログラムの中でinclude(‘input.php’);が実行させると「contact」フォルダの中のinput.phpが実行させます。
すなわちincludeは実行フォルダ名が同一に場合は、実行プログラム名の指定だけで良い事になります。
input.phpのプログラムは下記になります。
<?php /******************************* お問い合わせフォーム 入力画面 *******************************/ // 不正アクセスチェック if(!$noindexaccess){header("HTTP/1.0 404 Not Found");exit();} ?> <div id='background'> <div id='page-contener'> <div id='page-contener-data'> <div id='title'>*** お問い合わせ入力画面 ***</div> <br/> <form method="post" action="" enctype="multipart/form-data" id='form'> <div id='label'> <div id='label-a'>お名前</div><div id='label-b'> ※必須項目</div> <div id='label-c'> <?php if($error_flg == 1){echo $error_mes;}?></div> </div> <div id='name'> <div id='name-label'>姓:</div> <input type="text" id='name-box' name="LastName" value="<?php echo $_SESSION['LastName'];?>" required> <div id='name-label'>名:</div> <input type="text" id='name-box' name="FirstName" value="<?php echo $_SESSION['FirstName'];?>" required> </div> <br/> <div id='label'> <div id='label-a'>メールアドレス</div><div id='label-b'> ※必須項目</div> <div id='label-c'> <?php if($error_flg == 2){echo $error_mes;}?></div> </div> <div id='email'> <div id='email-label'> 本番用:</div> <input type="email" id='email-box' name="adress1" value="<?php echo $_SESSION['adress1'];?>" required> </div> <div id='email'> <div id='email-label'> 確認用:</div> <input type="email" id='email-box' name="adress2" value="<?php echo $_SESSION['adress2'];?>" required> </div> <br/> <div id='label-a'>件名</div> <input id='subject-box' type="text" name="subject" value="<?php echo $_SESSION['subject'];?>" > <br/><br/> <div id='label'> <div id='label-a'>メッセージ</div><div id='label-b'> ※必須項目</div> <div id='label-c'> <?php if($error_flg == 3){echo $error_mes;}?></div> </div> <textarea id='text-box' rows="10" name="message" required><?php echo $_SESSION['message'];?></textarea> <div> <button class='btn btn-success' name="action" value="confirm">確認する</button> </div> </form> </div> </div> </div> <style> #title{ text-align: center; font-size:20px;font-size:1.25rem;} #form{font-size:14px;font-size:0.875rem;} #label{ display:flex; align-items:flex-end;} #label-a{font-weight:bold;} #label-b{font-size:12px;font-size:0.75rem;} #label-c{color:#ff0000;} #name{ display:flex; align-items:center;} #name-label{margin-left:0.875rem;} #name-box{width:35%;} #email{ display:flex; align-items:center; margin-bottom:5px;} #email-label{margin-left:0.875rem;} #email-box{width:70%;} #subject-box{width:78%;margin-left:0.875rem;} #text-box{width:95%;margin-left:0.875rem;margin-bottom:10px;} </style>
※1.先頭の不正アクセスチェックはmain.phpから呼ばれてなければ何もしないで終了します。
※2.先頭のid=’background’,’page-contener’,’page-contener-data’は、固定ページと同様な位置に表示させる為のidです。
※3.フォームのメソッドをmethod=”post”にしてあるので、入力されたデータの受け取りは$_POST[××]で受け取ります。
※4.フォームのアクションをaction=””にしているので、サブミットされた時の飛び先は自分(main.php)になります。
※5.サブミットボタンはBootstrapのカラーボタンを利用しています。
このボタンの中にname=”action” value=”confirm”を指定しているの戻り先のmain.phpで$_POST[action]の値は、confirmで戻ります。
※6.input文等の所でrequiredを指定しています。
これは入力チェックをブラウザにしてくれ!というコマンドです。
これを指定するとブラウザが空白チェックやe-mailアドレスチェックを行ってくれます。
※7.ピンクの<?php echo $_SESSION[‘LastName’];?>等はcheck.phpの処理結果からこの画面に戻った時の既入力データやエラーメッセージです。
main.php→input.php→main.phpの次にこのプログラムが呼ばれます。
check.phpのプログラムは下記になります。
<?php /******************************* エラーチェック *******************************/ /* Reset SW */ $error_mes=''; $error_flg=0; /* get data set */ $_SESSION['LastName'] = $_POST['LastName']; $_SESSION['FirstName'] = $_POST['FirstName']; $_SESSION['adress1'] = $_POST['adress1']; $_SESSION['adress2'] = $_POST['adress2']; $_SESSION['subject'] = $_POST['subject']; $_SESSION['message'] = $_POST['message']; /* 名前欄のチェック */ if(is_my_blank($_SESSION['LastName']) || is_my_blank($_SESSION['FirstName'])){ $error_flg=1; $error_mes='・お名前欄が空白です。再入力をお願いします';} /* メールアドレス欄のチェック */ if($_SESSION['adress1'] !== $_SESSION['adress2']){ $error_flg=2; $error_mes='・メールアドレスが一致しません。チェックをお願いします';} /* メッセージ欄のチェック */ if(is_my_blank($_SESSION['message'])){ $error_flg=3; $error_mes='・メッセージ欄が空白です。何かメッセージをご記入ください';} /* 半角、全角スペースを判断する関数 */ function is_my_blank($str) { if(preg_match('/[^\s ]/',$str)) {return false;} else {return true;} } ?>
※1.始めにinput.phpで入力されたデータを $_POST[××];で受け取り$_SESSION[‘××’]にセットしています。これにより入力データはディスクに保存されるのでsendmail.php等でディスクからデータが読み出す事が可能になります。
※2.input.phpの必須入力エリアにrequiredを指定しているので、一般的なエラーチェックはブラウザが行ってくれます。
しかしブラウザでチェックできないのは下記になります。
①テキストやテキストエリアに半角または全角のスペースが入力された場合。
②メールアドレスと確認メールアドレスが異なる場合
これららがあった場合は$error_flgと$error_mesにデータをセットしてmain.phpに戻ります。
check.phpでエラーが無い場合はconfirm.phpが呼ばれます。
confirm.phpのプログラムは下記になります。
<?php /******************************* お問い合わせフォーム 確認画面 *******************************/ // 不正アクセスチェック if(!$noindexaccess){header("HTTP/1.0 404 Not Found");exit();} ?> <div id='background'> <div id='page-contener'> <div id='page-contener-data'> <div id='title'>*** お問い合わせ確認画面 ***</div> <div id='msg'>以下の内容でよろしければ[送信する]ボタンを押してください。</div> <form method="post" action="" enctype="multipart/form-data" id='form' onsubmit="return DoubleClick();"> <div id='label'>お名前</div> <div id='waku1'><?php echo $_SESSION['LastName'].$_SESSION['FirstName'];?></div> <div id='label'>メールアドレス</div> <div id='waku1'><?php echo $_SESSION['adress1'];?></div> <div id='label'>件名</div> <div id='waku1'><?php echo $_SESSION['subject'];?></div> <div id='label'>メッセージ</div> <div id='waku2'><?php echo nl2br($_SESSION['message']);?></div> <!-- 改行文字付出力 --> <div> <button class='btn btn-danger' name="action" value="">修正する</button> <button class='btn btn-success' name="action" value="sendmail" >送信する</button> </div> </form> </div> </div> </div> <style> #title{ font-size:20px;font-size:1.25rem; text-align: center;margin-bottom:10px;} #msg{font-size:14px;font-size:0.875rem;margin-bottom:10px;} #form{font-size:14px;font-size:0.875rem;} #label{font-weight:bold;} #waku1{ border:solid 1px #c0c0c0; border-radius: 5px; box-shadow:2px 2px #c0c0c0; padding:5px 10px; margin-left:0.875rem;margin-bottom:10px; width:60%;} #waku2{ border:solid 1px #c0c0c0; border-radius: 5px; box-shadow:2px 2px #c0c0c0; padding:5px 10px; margin-left:0.875rem;margin-bottom:10px; width:90%;} </style> <script> //メール送信のダブルクリック対策 var count=0; function DoubleClick() { if(count == 0){count=1;return true;} else {return false;} } </script>
※1.確認画面には修正ボタンと送信ボタンが設定されています。
※2.送信ブタンをダブルクリックするとメールが2通飛びます。そこでこれを防止する対策を組み込んでします。
フォームにあるonsubmit=”return DoubleClick();“がその機能になります。
onsubmitは、サブミットされる前に実行させれるコマンドです。
・onsubmit=”return true”の場合は、サブミットが実行されます。
・onsubmit=”return false”の場合は、サブミットしないで処理が終了します。
よってDoubleClick()関数で下記の処理をします。
1回目のCALLはカウンタをセットし、trueで戻ります(メールが送られる)
2回目のCALLはカウンタがセットされているのでfalseで戻ります(メールは送らない)
これにより、ダブルクリックされてもメールは1回しか飛びません。
※3.メッセージ欄($_SESSION[‘message’])は、改行が入った文書になっています。
これをそのままechoすると改行は無視されます。
そこでecho nl2br($_SESSION[‘message’])で改行が表示されます。
nl2brは指定された文字列に含まれる全ての改行文字(\nなど)の前に、HTMLの改行タグ(<br />など)を挿入するPHP関数になります。
最後はメール送信プログラムです。
sedmail.phpのプログラムは下記になります。
<?php /******************************* メール送信 *******************************/ // 不正アクセスチェック if(!$noindexaccess){header("HTTP/1.0 404 Not Found");exit();} /* メール宛先設定(必ず正確なメールアドレスを指定します) */ $to='××@▲▲'; /* 件名設定 */ if($_SESSION['subject'] == ''){$subject='お問い合わせ';} else{$subject=$_SESSION['subject'];} /* 本文設定はサイトに合わせて修正して下さい */ $message= 'このメールはホームネットワーク研究所のお問い合わせフォームから送信されました'."\n". '差出人:'.$_SESSION['LastName'].$_SESSION['FirstName']."\n". 'メールアドレス:'.$_SESSION['adress1']."\n"."\n". '件名:'.$subject."\n"."\n". '<質問内容>'."\n". $_SESSION['message']; /* メールヘッダ設定 */ $headers[0] = 'From:ホームネットワーク研究所 <✖✖@▲▲>';/* 送信先メールアドレスを設定して下さい */ $headers[1] = 'Reply-To:'.$_SESSION['LastName'].$_SESSION['FirstName'].'<'.$_SESSION['adress1'].'>'; ?> <div id='background'> <div id='page-contener'> <div id='page-contener-data'> <?php $mail_flg = wp_mail($to,$subject,$message,$headers);?> <?php if($mail_flg):?> <div id='msg'>メールは正常に送信されました。<br/> 後日、メールにて連絡させて頂きます。<br/> ご返信に時間がかかる場合がございますのでご了承下さい。</div> <?php unset($_SESSION['LastName'],$_SESSION['FirstName'],$_SESSION['adress1'],$_SESSION['adress2'],$_SESSION['subject'],$_SESSION['message']);?> <?php else:?> <div id='msg'>メールが正常に送れませんでした。<br/> [email protected]に直接メールして下さい。<br/> 申し訳ありません。</div> <?php endif;?> </div> </div> </div> <style> #msg{font-size:14px;font-size:0.875rem;} </style>
※1.$toと$headersは、必ずあなたのメールアドレスを設定して下さい。
※2.$messageに改行を入れるのに“¥n”を利用しています。
‘¥n’では改行は入りません。
※3.wp_mail($to,$subject,$message,$headers) でメールを送りますが$headersに複数の返信先を指定できます。詳細はプログラムを見て下さい。
※4.最後にunset関数で、ディスクに保存したセッションデータをクリアしています。