PHPでお問い合わせフォームを作る方法【サンプルコード付き】

php

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が利用できるローカル環境で行ってください。

コメント