PHPでお問い合わせフォームを作る方法
PHPでお問い合わせフォームを作る方法を紹介します。名前・メールアドレス・お問い合わせ内容を入力し、送信されたデータをCSVファイルへ保存できるサンプルです。入力チェックやエラーメッセージ表示にも対応しているため、PHPフォーム作成の基本を学びたい場合にも利用できます。
コードについて
本記事のコードはサンプルコードです。ご利用前に必ず動作確認を行ってください。
免責事項 本コードの利用により発生した損害について、当サイトは一切の責任を負いません。
免責事項 本コードの利用により発生した損害について、当サイトは一切の責任を負いません。
デモ
お問い合わせフォーム
コードをコピーして使おう!
<?php
// CSVファイル
$csv_file = __DIR__ . '/data.csv';
// エラーメッセージ
$errors = [];
// 送信完了メッセージ
$success = '';
// 入力値保持
$name = '';
$email = '';
$message = '';
// フォーム送信時
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
// 入力値取得
$name = trim($_POST['name'] ?? '');
$email = trim($_POST['email'] ?? '');
$message = trim($_POST['message'] ?? '');
// お名前チェック
if ($name === '') {
$errors[] = 'お名前を入力してください。';
}
// メールアドレスチェック
if ($email === '') {
$errors[] = 'メールアドレスを入力してください。';
} elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
$errors[] = 'メールアドレスの形式が正しくありません。';
}
// お問い合わせ内容チェック
if ($message === '') {
$errors[] = 'お問い合わせ内容を入力してください。';
}
// エラーなし
if (empty($errors)) {
// CSVへ保存
$fp = fopen($csv_file, 'a');
if ($fp) {
if (filesize($csv_file) === 0) {
fputcsv($fp, [
'date',
'name',
'email',
'message'
]);
}
fputcsv($fp, [
date('Y-m-d H:i:s'),
$name,
$email,
$message
]);
fclose($fp);
}
$success = 'お問い合わせ内容を送信しました。';
// フォーム初期化
$name = '';
$email = '';
$message = '';
}
}
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>お問い合わせフォーム</title>
<style>
/* 全体 */
body{
margin:0;
padding:30px;
font-family:sans-serif;
background:#fff;
}
/* お問い合わせフォーム */
.contact-wrap{
border:1px solid #e5e7eb;
border-radius:20px;
padding:24px;
background:#fff;
}
/* フォームカード */
.contact-card{
max-width:600px;
margin:0 auto;
padding:24px;
border:1px solid #e5e7eb;
border-radius:18px;
background:#f8fafc;
}
/* タイトル */
.contact-title{
font-size:22px;
font-weight:700;
margin-bottom:20px;
}
/* 入力欄 */
.field{
display:flex;
flex-direction:column;
gap:6px;
margin-bottom:14px;
}
label{
font-weight:700;
}
input,
textarea{
width:100%;
box-sizing:border-box;
padding:12px;
border:1px solid #d1d5db;
border-radius:10px;
font:inherit;
}
textarea{
min-height:130px;
resize:vertical;
}
/* エラーメッセージ */
.error{
color:#dc2626;
font-size:13px;
font-weight:700;
margin-bottom:12px;
}
/* 成功メッセージ */
.success{
padding:14px;
border-radius:12px;
border:1px solid #bbf7d0;
background:#f0fdf4;
color:#15803d;
font-weight:700;
margin-bottom:14px;
}
/* 送信ボタン */
.btn{
width:100%;
height:46px;
border:none;
border-radius:10px;
background:#0b6bff;
color:#fff;
font-weight:700;
cursor:pointer;
}
</style>
</head>
<body>
<div class="contact-wrap">
<div class="contact-card">
<div class="contact-title">
お問い合わせフォーム
</div>
<?php if ($success !== ''): ?>
<div class="success">
<?= htmlspecialchars($success, ENT_QUOTES, 'UTF-8') ?>
</div>
<?php endif; ?>
<?php foreach ($errors as $error): ?>
<div class="error">
<?= htmlspecialchars($error, ENT_QUOTES, 'UTF-8') ?>
</div>
<?php endforeach; ?>
<!-- お問い合わせフォーム -->
<form method="post">
<!-- お名前入力欄 -->
<div class="field">
<label>お名前</label>
<input
type="text"
name="name"
value="<?= htmlspecialchars($name, ENT_QUOTES, 'UTF-8') ?>">
</div>
<!-- メールアドレス入力欄 -->
<div class="field">
<label>メールアドレス</label>
<input
type="email"
name="email"
value="<?= htmlspecialchars($email, ENT_QUOTES, 'UTF-8') ?>">
</div>
<!-- お問い合わせ内容入力欄 -->
<div class="field">
<label>お問い合わせ内容</label>
<textarea name="message"><?= htmlspecialchars($message, ENT_QUOTES, 'UTF-8') ?></textarea>
</div>
<!-- 送信ボタン -->
<button class="btn" type="submit">
送信する
</button>
</form>
</div>
</div>
</body>
</html>
ファイル構成と設置方法
このサンプルで使用するファイル構成です。
下記のファイルを同じフォルダ(同じ階層)へ配置してください。
contact_form/
├─ index.php
└─ data.csv
サーバーへ設置する場合は、上記ファイルを同じフォルダ(同じ階層)へアップロードしてください。
index.phpがお問い合わせフォーム本体です。
data.csvには送信されたお問い合わせ内容を保存します。
data.csvが存在しない場合は、初回送信時に自動作成されます。あらかじめ作成する場合は、CSVタブの内容をdata.csvとして保存してください。
PHPはサーバー上で実行されるため、PHPファイルをダブルクリックしても動作しません。動作確認はレンタルサーバーへアップロードするか、PHPが利用できるローカル環境で行ってください。
コメント