ChatGPTまたはClaudeで構築されたサイト向けのフォーム

ChatGPTやClaudeにウェブサイトの作成を依頼する際は、このプロンプトを追加することで、実際にメッセージを送信できるお問い合わせフォームがページに組み込まれます。このフォームはプレーンなHTMLで構成されており、どの静的ホストでも動作します。

ホームページからアクセスキーを取得してください。
プロンプトを、サイトへのリクエストと一緒に貼り付けてください。
フォームのアクションが Formgong の /submit URL であり、キーがご自身のものになっているかご確認ください。
ページをアップロードし、テスト送信を行ってください。

Prompt

When you build this website, include a working contact form as a plain HTML <form> in the same file, so it works on any static host without JavaScript. Submissions go to Formgong, a hosted form backend.

Formgong spec (follow exactly):
- Plain HTML: <form action="https://formgong.com/submit" method="POST">. With JavaScript, POST the same fields to https://formgong.com/submit using fetch.
- Hidden field access_key with value fk_your_access_key. The key is public and belongs in frontend code. Do not move it to a server or a secret.
- Hidden field _lang with the page language code, e.g. "en" (on multilingual sites use document.documentElement.lang). Formgong uses it for error messages, the thank-you page, and the autoreply.
- Fields: name, email, message (required); phone is optional. Keep these field names.
- Honeypot: <input type="text" name="botcheck" tabindex="-1" autocomplete="off"> inside a wrapper with aria-hidden="true", moved off-screen with CSS (position:absolute; left:-10000px). Never fill it.
- Success, plain form POST: optionally add a hidden _redirect field with the absolute https URL of the site's thank-you page. Without it, Formgong shows its own thank-you page.
- Success, fetch: send Accept: application/json (and Content-Type: application/json for a JSON body; for FormData let the browser set it). If the response has success === true, show an inline thank-you message and reset the form; otherwise show the response's message.
- Turnstile: only if I give you a Cloudflare Turnstile site key, add <script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script> and <div class="cf-turnstile" data-sitekey="SITE_KEY"></div> inside the form. Otherwise leave it out.
- Optional: add <script src="https://formgong.com/fg.js" async></script> once per page. It fills _lang from <html lang>, sets the Turnstile language, and counts form views without cookies.
- Do not create a backend, API route, server function, database table, or email-sending code (Supabase, Resend, SendGrid, nodemailer), and do not add secrets. No file uploads.

Minimal code

HTML

<form action="https://formgong.com/submit" method="POST">
  <input type="hidden" name="access_key" value="fk_your_access_key">
  <input type="hidden" name="_lang" value="ja">
  <label>お名前 <input type="text" name="name" autocomplete="name" placeholder="山田 太郎" required></label>
  <label>メールアドレス <input type="email" name="email" autocomplete="email" placeholder="you@example.com" required></label>
  <label>メッセージ <textarea name="message" placeholder="ご用件をご記入ください" required></textarea></label>
  <div aria-hidden="true" style="position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden">
  <label>この欄は空のままにしてください<input type="text" name="botcheck" tabindex="-1" autocomplete="off"></label>
</div>
  
  <button type="submit">送信</button>
</form>

Before you publish

The form posts to https://formgong.com/submit (form action or fetch URL).
access_key holds your key from the Formgong dashboard, not fk_your_access_key.
A hidden, empty botcheck field is present.
_lang matches the page language.
No API route, server function, database table, or secret was added for the form.
A test submission shows up in the Formgong inbox and in your email.

キーを取得