Cursorで問い合わせフォームを自作｜外部ツール不要で作る手順

ポイント。フォーム作りの成否は、手を動かす前の「3つの設計」でほぼ決まります。次の3つです。

• どんな項目を集めるか
• 入力内容をどう自社に届けるか
• スパムや不正送信をどう防ぐか

Cursorとは、AIに自然な日本語で指示を出すだけでコードを生成してくれるエディタのことです。プログラミング知識がなくても「こういうフォームを作って」と頼めば、HTMLのコードが返ってきます。

無料プランもありますが、より高度な機能や利用量に応じて有料プランが提供されています。詳しい仕様や料金体系はCursor公式ドキュメントで確認できます。

だからこそ、何を作りたいかを自分の中で固めておくことが、何より重要になります。

自作・外部サービス・WordPressプラグインのどれを選ぶか、判断の目安を整理しておきましょう。

方法	費用感	自由度	必要な準備	向いている会社
Cursorで自作	フォームのホスティング費用は月額ゼロも可能（サーバー代のみ）。ただし、Cursorツール自体には無料プランと有料プランがあります。	高い（自由にカスタマイズ可）	送信の仕組みの土台づくり	独自の項目が欲しい・ランニングコストを抑えたい
外部フォームサービス	月額制が多い	中（提供範囲内）	アカウント登録のみ	とにかく早く・手間なく設置したい
WordPressプラグイン	無料〜有料	中〜高	WordPress環境	すでにWordPressで運用している

「ランニングコストをかけたくない」「自社独自の項目を自由に増やしたい」という会社にとって、Cursorでの自作は有力な選択肢になります。一方で、「とにかく今すぐ手間なく置きたい」なら外部サービスの方が早いこともあります。ここは正直にお伝えしておきます。

Cursorで問い合わせフォームを作る具体的な手順

ここからは、実際に手を動かす流れを5ステップで解説します。コードもそのまま使える形で載せますので、自社の値に書き換えながら進めてください。

ステップ1。集める項目を紙に書き出す

Cursorを開く前に、まず紙やメモに「欲しい項目」を箇条書きにします。これがCursorへの指示書になります。

ここで一番やりがちな失敗が、項目の盛りすぎです。入力項目が多いほど、訪問者は途中で面倒になって離脱します。「この情報がないと営業や対応が進まない」というものだけに絞りましょう。

• お名前：必須。誰からの問い合わせかを把握する
• メールアドレス：必須。返信先として使う
• お問い合わせ内容：必須。自由記述で要件を書いてもらう
• 会社名・電話番号：任意でよい。必須にするほど離脱が増える

ステップ2。Cursorに日本語で指示して見た目を作る

項目が決まったら、Cursorに自然な日本語で指示します。完璧な指示文を考え込む必要はありません。いまのAIは、ざっくり頼めば自分で整えてくれます。まずは出発点として、次のくらい短いたたき台（seed）で十分です。

基本的なHTMLの問い合わせフォームを作ってください。
項目は、お名前（必須）、メールアドレス（必須）、
お問い合わせ内容（必須・複数行）です。
スマホでも見やすいようにCSSも付けてください。
送信先は contact.php への POST 送信にしてください。

［ここに自社の都合（任意項目など）を追記して、AIと対話しながら詰める］

すると、たとえば次のようなHTMLが返ってきます。これがフォームの「入力画面」です。1か所だけ、後で説明するスパム対策の隠し項目（website）を入れてあります。

<form action="contact.php" method="post">
  <label>お名前（必須）
    <input type="text" name="name" required>
  </label>
  <label>メールアドレス（必須）
    <input type="email" name="email" required>
  </label>
  <label>お問い合わせ内容（必須）
    <textarea name="message" required></textarea>
  </label>
  <!-- ハニーポット：人には見えない隠し項目（スパム対策） -->
  <input type="text" name="website" style="display:none" tabindex="-1" autocomplete="off">
  <button type="submit">送信する</button>
</form>

ステップ3。送信の仕組み（配達係）を用意する

ここが最重要です。先ほどのHTMLだけでは、送信ボタンを押しても内容はどこにも届きません。入力内容を自社のメールに届ける「配達係」が必要です。PHPが動くサーバー（XSERVERやさくらなど）を使っているなら、次のPHPファイルを置くのが一番シンプルです。

このコードは、入力チェック・スパム対策・メール送信までを一通りこなす完結した例です。冒頭コメントの前提を読んで、自社の値に書き換えてください。

<?php
// 【前提】このファイルを contact.php としてPHPが動くサーバーに置く
// HTMLフォームの action="contact.php" から送信される想定
// ［送信先メール］と［自社ドメインのアドレス］は必ず自社の値に変更する

// 1. POST以外のアクセスは弾く
if ($_SERVER['REQUEST_METHOD'] !== 'POST') {
    http_response_code(405);
    exit('不正なアクセスです');
}

// 2. ハニーポット：隠し項目に値が入っていたらボットなので静かに終了
if (!empty($_POST['website'])) {
    exit();
}

// 3. 入力値を取得して前後の空白を除去
$name    = trim($_POST['name'] ?? '');
$email   = trim($_POST['email'] ?? '');
$message = trim($_POST['message'] ?? '');

// 4. 入力チェック（必須・形式・長さ）
$errors = [];
if ($name === '' || mb_strlen($name) > 50) {
    $errors[] = 'お名前を正しく入力してください';
}
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
    $errors[] = 'メールアドレスの形式が正しくありません';
}
if ($message === '' || mb_strlen($message) > 2000) {
    $errors[] = 'お問い合わせ内容を入力してください';
}
if ($errors) {
    http_response_code(400);
    exit(implode("\n", $errors));
}

// 5. メールヘッダーインジェクション対策（改行混入を拒否）
foreach ([$name, $email] as $v) {
    if (preg_match('/[\r\n]/', $v)) { exit(); }
}

// 6. メール送信
$to      = 'info@example.com';        // ［送信先メールに変更］
$subject = '【サイトお問い合わせ】' . $name . '様';
$body    = "お名前: {$name}\nメール: {$email}\n\n内容:\n{$message}";
$headers = 'From: no-reply@example.com' . "\r\n"  // ［自社ドメインのアドレスに変更］
         . 'Reply-To: ' . $email;

mb_language('Japanese');
mb_internal_encoding('UTF-8');

if (mb_send_mail($to, $subject, $body, $headers)) {
    header('Location: thanks.html'); // 完了ページへ遷移
    exit();
} else {
    http_response_code(500);
    exit('送信に失敗しました。時間をおいて再度お試しください');
}

「PHPは難しそう」と感じたら、この丸ごとのコードをCursorに貼り付けて「この処理を解説して」「自社用に直すべき箇所を教えて」と聞けば、対話しながら理解できます。AIは生成だけでなく、既存コードの説明役としても優秀です。

なお、Googleフォームの回答をスプレッドシートで管理したい場合は、Google Apps Script（GAS）という無料の仕組みと組み合わせる方法もあります。社内向けの問い合わせ集計なら、こちらの方が手軽なこともあります。総務・情シスへの問い合わせをデータ化する集計フォーム自作術でも、集計を前提としたフォームの考え方を解説しています。

ステップ4。サイトに組み込んで設置する

HTMLを固定ページに貼り付けるか、サーバーに直接ファイルを置いて公開します。WordPressを使っているなら、固定ページのコード編集部分にフォームのHTMLを貼り付ける形が分かりやすいでしょう。具体的な貼り付け場所の名称はバージョンで変わるため、正確な操作は公式ヘルプで確認してください。

ステップ5。必ずテスト送信して確認する

公開したら、必ず自分でテスト送信します。ここを省くと「問い合わせが届いていなかった」という最悪の事故につながります。公開前チェックリストを用意しました。

• 届くか：テスト送信して、設定したメールアドレスに実際に届くか確認する
• 迷惑メール：迷惑メールフォルダに入っていないかも確認する
• 必須チェック：空欄のまま送信して、ちゃんとエラーになるか確認する
• スマホ表示：スマホで開いて、はみ出さず入力できるか確認する
• SSL：URLが「https」から始まっているか確認する（個人情報を扱うため必須）

自作するとどう変わるか。コストと自由度のメリット

Cursorでフォームを自作すると、主に「コスト」と「自由度」の2つで効果が出ます。

まずコスト面です。外部フォームサービスの多くは月額制です。仮に月3,000円のサービスを使い続けると、年間で約36,000円、5年で18万円ほどになります。自作なら、すでに借りているサーバー上で動かせるため、追加の月額費用をほぼゼロにできます（金額はあくまで一般的な例であり、利用サービスによって変わります）。

次に自由度です。外部サービスでは「この項目を足したい」「この見た目に変えたい」と思っても、提供範囲の中でしか調整できないことがあります。自作なら、Cursorに「電話番号の項目を任意で追加して」と頼むだけで、その場で変更できます。事業の変化に合わせてフォームを育てられるのは、自作の大きな強みです。

AIにコードや文章を作らせる流れは、もはや一部の技術者だけのものではありません。

成果を出す会社の共通点。フォームを「ただの受付窓口」で終わらせず、「どんな問い合わせが・何件・どんな内容で来たか」を記録・分析し、改善につなげています。届いた内容をスプレッドシートに溜めるだけでも、営業の打ち手が見えてきます。

「指示を出すだけでサイトが直る」という体験そのものに価値を感じる方は、Vibe CodingでWeb担当者が脱ストレスする方法もあわせて読んでみてください。

よくある失敗と回避法。現場でつまずく3パターン

フォームの自作で実際によく見かける失敗を、3つに絞って紹介します。どれも「起きる状況→どうなるか→どう防ぐか」のセットで覚えておくと、事前に避けられます。

失敗1。設計せずに作り始めて作り直しになる

いきなりCursorでフォームを作り始めると、後から「項目が足りない」「送信の仕組みを考えていなかった」「セキュリティが甘い」と気づき、最初から作り直しになります。これが一番多い失敗です。

防ぎ方はシンプルです。冒頭で触れた「3つの設計（項目・送信方法・スパム対策）」を、手を動かす前に紙1枚にまとめておくこと。たった10分の準備が、数時間の手戻りを防ぎます。

失敗2。スパムメールが大量に届く

スパム対策をしないままフォームを公開すると、ボット（自動プログラム）から迷惑メッセージが大量に送られてきます。本物の問い合わせがその中に埋もれ、見逃してしまう事故も起きます。

防ぎ方は2段構えがおすすめです。

• ハニーポット：先ほどのコードに入れた、人には見えない隠し項目です。ボットだけが反応して入力するため、値が入っていれば自動で弾けます。
• reCAPTCHA：より強力に防ぎたい場合に設置します。導入にはGoogle側での登録とキーの取得が必要なので、正確な手順や料金体系は公式ヘルプで確認してください。

失敗3。送信したのにメールが届かない

「フォームは動いているのに、なぜか自社にメールが来ない」。これも非常に多いトラブルです。原因は、宛先アドレスの打ち間違い（全角文字の混入など）、サーバー側のメール設定の不整合、SMTP未設定など、地味なものが大半です。

防ぎ方は、公開後に必ずテスト送信すること、そして送信ログを残せるようにしておくことです。トラブルが起きたとき、ログがあれば原因を追えます。「動いているはず」と思い込まず、自分の目で届くことを確認する習慣が、機会損失を防ぎます。

個人情報を扱うフォームでは、SSL暗号化（httpsで始まるURL）とプライバシーポリシーへのリンク明記が事実上の必須です。これがないと、訪問者に不安を与えるだけでなく、企業の信頼性にも関わります。

使う側の落とし穴。自作の「向き不向き」を正直に話します

ここまで自作のやり方を解説してきましたが、現場を見てきた立場として、率直にお伝えしておきたい落とし穴があります。教科書には書かれにくい、運用の本音の部分です。

一番の落とし穴は、「作れること」と「運用し続けられること」は別だという点です。Cursorを使えば、フォーム自体は驚くほど早く作れます。問題はその後です。送信の仕組みやセキュリティの土台は、サーバーの環境やメールの設定が絡むため、一度トラブルが起きると、コードを書いた本人しか直せない「属人化」に陥りがちです。

もう一つの見落としが、コストの考え方です。月額料金がゼロになる代わりに、保守やトラブル対応という「時間のコスト」が自社に乗ります。フォームが止まれば問い合わせが止まり、それは売上の機会損失に直結します。月数千円の外部サービス料金と、自社で抱えるリスクを天秤にかける視点が必要です。

現場のおすすめ。送信の仕組みとセキュリティの「土台」だけは、最初に詳しい人へ整えてもらう。その後の項目変更や文言修正は、Cursorに相談しながら自社で回す。この役割分担が、いちばん無理がなく続きます。

「見た目はAIで、土台はプロと一緒に」。この切り分けができると、自作のメリット（自由度とコスト）を活かしつつ、リスクだけを外せます。

逆に、全部を自社だけで抱え込もうとすると、本業の片手間では回らなくなることが多いのが実情です。社内に専任のIT担当がいない会社ほど、この見極めが大事になります。

なお、AIに業務情報を入力する際の注意点はAIに入力してはいけない個人情報とAIセキュリティ社内ルールの作り方にまとめています。

よくある質問

ここまで読んで「自分でも作れそう」と感じた方は、ぜひ手を動かしてみてください。一方で「土台づくりやトラブル対応に不安が残る」「本業が忙しくて運用まで手が回らない」と感じた方は、無理に全部を抱え込む必要はありません。コレットラボのAI業務システム化支援では、AIで作るフォームやサイトの内製化を、土台づくりから運用の伴走までお手伝いしています。まずは現状を整理するだけでも構いません。AI業務システム化の詳細はこちらから、気軽にお話を聞かせてください。