WordPressのプラグインは便利ですが、サイトの動作が重くなってしまうのが難点です。今回はHTMLのフォームを使用して、お問い合わせフォームを設置してみます。PHPの知識がある人向けの内容です。JavaScriptも少し出てきます。
まず、お問い合わせフォーム画面のファイルpage-contactus.phpを作成します。page.phpをコピーして名前を変更すればよいと思います。
内容は以下のとおり。
<?php
/*
Template name: contact
*/
?>
<?php get_header(); ?>
<?php
session_cache_limiter('none');
session_start();
if ($_SESSION['onamae']) {
$onamae = $_SESSION['onamae'];
}
if ($_SESSION['address']) {
$address = $_SESSION['address'];
}
if ($_SESSION['subject']) {
$subject = $_SESSION['subject'];
}
if ($_SESSION['sentences']) {
$sentences = $_SESSION['sentences'];
}
?>
<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
<?php the_content(); ?>
<form action="/thankyou" method="post" id="contactform">
<input placeholder="お名前" required type="text" name="onamae" maxlength="10" value="<?php echo $onamae; ?>">
<input placeholder="返信用メールアドレス" required type="text" name="address" maxlength="256" value="<?php echo $address; ?>">
<input placeholder="メッセージタイトル" type="text" name="subject" maxlength="30" value="<?php echo $subject; ?>">
<textarea placeholder="お問い合わせ内容" required name="sentences" cols="55" wrap="hard"><?php echo $sentences; ?></textarea>
<input type="submit" value="送信">
</form>
<?php endwhile; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
実際はもっと細かくマークアップしていますが、簡単に書くと上記のようになります。各自のHTML構造に合わせて組み込んでみてください。
1つ目のポイント：
<?php
/*
Template name: contact
*/
?>これで、WordPressにこのテンプレートを認識させています。これは後述する管理画面での設定に必要になります。
2つ目のポイント：
セッションを使用してデータ送信します。ここで、form要素のname属性にnameを使用すると、動作しません！！
例の名前を入力する要素のnameにはonamaeを使用しています。あとは、HTMLでフォームを設置します。セッションのセキュリティとかは最新情報をもとに強化してください。
次に、送信後に表示される画面となるファイルpage-sendmail.phpを作成します。またpage.phpをコピペでいいです。
<?php
/*
Template name: sendmail
*/
?>
<?php get_header(); ?>
<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
<div>
<?php
mb_language("japanese");
mb_internal_encoding("UTF-8");
if(!($_POST['onamae']) || !($_POST['address']) || !($_POST['sentences'])) {
if(!($_POST['onamae'])) {
echo "<p>お名前を入力してください。<br></p>";
} if(!($_POST['address'])) {
echo "<p>返信用メールアドレスを入力してください。<br></p>";
} if(!($_POST['sentences'])) {
echo "<p>メッセージ本文を入力してください。<br></p>";
}
browserBack();
} else {
$onamae = $_POST['onamae'];
$address = $_POST['address'];
$subject = "サイトからのメール：".$_POST['subject'];
$sentences = $_POST['sentences'];
$sentences = $onamae."($address)"."nn".$sentences;
if(mb_send_mail(get_option("admin_email"),$subject,$sentences)){
the_content();
} else{
echo "<p>メッセージは正しく送信されませんでした。<br>入力内容を確認してください。</p>";
browserBack();
}
}
function browserBack() {
session_cache_limiter('none');
session_start();
$_SESSION['onamae'] = $_POST['onamae'];
$_SESSION['address'] = $_POST['address'];
$_SESSION['subject'] = $_POST['subject'];
$_SESSION['sentences'] = $_POST['sentences'];
echo "<a href='" . site_url() . "/contact'>メッセージ入力画面に戻る</a>";
//session_destroy();
}
?>
</div>
<?php endwhile; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
1つ目のポイント：
<?php
/*
Template name: sendmail
*/
?>先ほどと同様、テンプレート名を設定してください。
2つ目のポイント：
if(!($_POST['onamae']) || !($_POST['address']) || !($_POST['sentences'])) {
if(!($_POST['onamae'])) {
echo "<p>お名前を入力してください。<br></p>";
} if(!($_POST['address'])) {
echo "<p>返信用メールアドレスを入力してください。<br></p>";
} if(!($_POST['sentences'])) {
echo "<p>メッセージ本文を入力してください。<br></p>";
}
browserBack();
}ここで、必要な情報がきちんと入力されているかチェックしています。
else {
$onamae = $_POST['onamae'];
$address = $_POST['address'];
$subject = "サイトからのメール：".$_POST['subject'];
$sentences = $_POST['sentences'];
$sentences = $onamae."($address)"."nn".$sentences;
if(mb_send_mail(get_option("admin_email"),$subject,$sentences)){
the_content();
} else{
echo "<p>メッセージは正しく送信されませんでした。<br>入力内容を確認してください。</p>";
browserBack();
}
}
入力内容がOKなら、送信します。送信先は、管理画面の設定>一般で登録しているメールアドレスになります。get_option("admin_email")で指定しています。
3つ目のポイント：
JavaScriptを使用して、戻るボタンを設置します。
前の入力画面に戻っても、入力した内容が保持されています。
function browserBack() {
session_cache_limiter('none');
session_start();
$_SESSION['onamae'] = $_POST['onamae'];
$_SESSION['address'] = $_POST['address'];
$_SESSION['subject'] = $_POST['subject'];
$_SESSION['sentences'] = $_POST['sentences'];
echo "<a href='" . site_url() . "/contact'>メッセージ入力画面に戻る</a>";
}
では、管理画面に戻ります。
固定ページを新規作成してください。
まず、入力画面からです。
最初のファイルでTemplate name: contactと書いてあったので、テンプレートで選択します。スラッグも半角英数字にしておきましょう！最後に、送信後の画面の固定ページを新規作成します。
テンプレート名は先ほどと同様、送信後画面のファイルで指定したsendmailを選択します。
ここで大きなポイントです。
スラッグには、1枚目のファイルcontactus.phpで指定した送信先のアドレスを入力します。
<form action="/thankyou" method="post" id="contactform">
よく見ると、action="/thankyou"と書いていますね！
だから、この固定ページのスラッグにはthankyouと指定します。
これで、お問い合わせページが完成しました。
リンクは
echo get_permalink( get_page_by_path("contact")->ID);
これで取得できます。
